Html 引导navbar品牌将链接文本与svg对齐

我试图使用bootstrap的

.navbar brand

类在我的navbar中拥有一个svg，但我希望文本位于svg旁边，并将其与该svg对齐。我在导航栏中有svg和文本，但它们没有对齐。这是标题的代码

nava{
颜色：白色
}
导航{背景色：#1c71b9；z索引：1；}
.navbar切换{边框：3px纯白；}
.图标栏{背景色：白色；}
.navbar品牌：hover{背景色：白色；
颜色：#1c71b9；
}
正文{页边顶部：50px；背景色：白色；}
h1，h2，h3，h4，h5，h6，p{
-webkit字体平滑：抗锯齿；
文本呈现：优化易读性；
}
.row+.row{页边距顶端：20px；}
.itemHeading{font-weight:bold；}
.icon{显示：块；最大宽度：100%；页边距顶部：10px；}
.description标题{页边距顶部：20px；文本对齐：中间；}
.description节{背景色：#e5；}
.main说明标题{文本对齐：居中；}
.description段落{文本对齐：居中；}
.centerDescriptionButton{填充底部：20px；}
.第一张幻灯片视频{宽度：100%；}
.第二张幻灯片视频{宽度：100%；}
.第三张幻灯片视频{宽度：100%；}
.第一张幻灯片{宽度：100%；}
.第二张幻灯片{宽度：100%；}
.第三张幻灯片{宽度：100%；}
#myCarousel{页边顶部：50px；}
.card{宽度：100%；边距底部：30px；框阴影：05px；填充：15px；背景色：白色；}
.card视频{宽度：100%；}
.card title{字体大小：粗体；}
.错误{颜色：红色；}
.success{颜色：绿色；}
.formQuestion{color:darkblue；}
.overlay{位置：绝对位置；
显示器：flex；
排名：0；
底部：0px；
左：0；
右：0；
对齐项目：居中；
证明内容：中心；
弯曲方向：立柱；
颜色：白色；
文本对齐：居中；
}
.overlay.VideoButtonRapper{
弯曲方向：行；
边缘底部：30px；
位置：相对位置；
}
.VideoBackgroundRapper{位置：相对；宽度：100%；}
.videoBackground{宽度：100%；}
.blue{color:darkblue；背景色：darkblue；}
#signupApp{margin top:50px；}
导航svg{高度：100%；填充：白色；}
.navbar品牌{边距：0；填充：0；}
.navbar品牌：hover>svg{高度：100%；填充：#1c71b9；}
.formQuestion+.tooltip>.tooltip内部{背景色：深蓝色；字体重量：粗体；}
.success+.tooltip>.tooltip内部{背景色：绿色；字体重量：粗体；}
.error+.tooltip>.tooltip内部{背景色：红色；字体重量：粗体；}

切换导航

将

.logo文本{位置：相对；顶部：-3px；左边距：5px；}

添加到CSS中。 然后把文本（CreativeEngine）放在一个span中，并给它一个类：“logo text”

请参见下面的示例：

nava{
颜色：白色
}
导航{背景色：#1c71b9；z索引：1；}
.navbar切换{边框：3px纯白；}
.图标栏{背景色：白色；}
.navbar品牌：hover{背景色：白色；
颜色：#1c71b9；
}
正文{页边顶部：50px；背景色：白色；}
h1，h2，h3，h4，h5，h6，p{
-webkit字体平滑：抗锯齿；
文本呈现：优化易读性；
}
.row+.row{页边距顶端：20px；}
.itemHeading{font-weight:bold；}
.icon{显示：块；最大宽度：100%；页边距顶部：10px；}
.description标题{页边距顶部：20px；文本对齐：中间；}
.description节{背景色：#e5；}
.main说明标题{文本对齐：居中；}
.description段落{文本对齐：居中；}
.centerDescriptionButton{填充底部：20px；}
.第一张幻灯片视频{宽度：100%；}
.第二张幻灯片视频{宽度：100%；}
.第三张幻灯片视频{宽度：100%；}
.第一张幻灯片{宽度：100%；}
.第二张幻灯片{宽度：100%；}
.第三张幻灯片{宽度：100%；}
#myCarousel{页边顶部：50px；}
.card{宽度：100%；边距底部：30px；框阴影：05px；填充：15px；背景色：白色；}
.card视频{宽度：100%；}
.card title{字体大小：粗体；}
.错误{颜色：红色；}
.success{颜色：绿色；}
.formQuestion{color:darkblue；}
.overlay{位置：绝对位置；
显示器：flex；
排名：0；
底部：0px；
左：0；
右：0；
对齐项目：居中；
证明内容：中心；
弯曲方向：立柱；
颜色：白色；
文本对齐：居中；
}
.overlay.VideoButtonRapper{
弹性指令
.icon {
    display: inline-flex;
    align-self: center;
}

.icon svg, .icon img {
    height: 1em;
    width: 1em;
    fill: currentColor;
}

.icon.baseline svg, .icon img {
    top: .125em;
    position: relative;
}

h1 {
    margin:0 0 5px 0;
    padding:0;
    line-height:1;
    font-weight:normal;
  position:relative;
}

h1 {
  font-size:69px;
}

<h1>
   <div class="icon baseline">
      <svg width="58" height="58" viewBox="1 1 180 150">
         <path class="icon-info" d="M153.4,91l-30.2,8c-4.2,11.5-13.5,20.6-26.1,24.1c-20.7,5.7-42.2-6.5-48-27.2c-5.7-20.7,6.5-42.2,27.2-48 c15.9-4.4,32.5,0.9,41.9,15.1l-19.5,5.3c-3.4-2.4-7.6-3.8-12-3.8c-11.6,0-20.9,9.4-20.9,20.9s9.4,20.9,20.9,20.9 c8.5,0,15.8-5.1,19.1-12.3L153.5,81l0.7,0l11.4-6.7L163,62.6l-13.1-1.3l-4.3-9.1l7.3-11l-7.4-9.4l-12.4,4.5l-7.9-6.4l1.8-13.1 l-10.7-5.2l-9.2,9.5l-9.8-2.3l-4-12.6L81.3,6.1l-4.2,12.5l-9.9,2.2l-9.1-9.6l-10.8,5.1L49,29.4l-7.9,6.2L28.7,31l-5.2,6.4l-2.3,2.9 v0l7.2,11.1l-0.9,1.8l-3.6,7.3l-13.2,1.1L8,73.1L19.3,80l-0.1,10.1L7.9,96.9l2.6,11.6l13.1,1.3l4.3,9.1l-7.3,11v0l3.7,4.7l3.7,4.7 l12.4-4.5l0.2,0.1l0,0l5.8,4.7l1.9,1.5l-1.8,13.1l10.7,5.2l9.2-9.5l9.8,2.3l4,12.6l11.9,0.1l4.2-12.5l9.9-2.2l9.1,9.6l10.8-5.1 l-1.6-13.1l7.9-6.2l12.4,4.7l7.5-9.3l-7.2-11.1l4.4-9.1l13.2-1.1l2.7-11.6L154.1,91L153.4,91z"/>
         </path>
      </svg>
      </svg>
   </div>
   TM
</h1>