Html 移动按钮标记中的元素

我有一段代码：

<div style="float: right">       
<button type="button" class="btn btn-link colorGrey " ng-click="ViewFactory.ShowView('WelcomepageModule')" ng-show="({IsActive: true, IsVisible: true, IsMandatory: true}).IsVisible" ng-disabled="!({IsActive: true, IsVisible: true, IsMandatory: true}).IsActive" ng-required="({IsActive: true, IsVisible: true, IsMandatory: true}).IsMandatory" required="required" style="font-size: 1.5em;">     
        <span class="fa fa-times" style="margin-right: 2px"></span> Close                                 
</button>
</div>

接近

我想将字体图像与单词“Close”的中心对齐。

---

如何操作？

不确定您是希望图标与顶部对齐，还是希望图标位于顶部。这两个都是

您可以将按钮的内容设置为块，并使用下面的css

<div style="float: right">
  <button type="button" class="btn btn-link colorGrey" style="font-size: 1.5em;">
    <span class="fa fa-times" style="margin-right: 2px"></span>
    <span>Close</span>
  </button>
</div>

button > * {
  display: block;
  text-align: center;
}

---

您的代码的简单版本。请尝试使用以下语法的概念

HTML

<button type="button" class="btn btn-link colorGrey ne-cls">
<span class="fa fa-times icn-cls" style="margin-right: 2px; "></span> <span class="txt">Close</span> 
 </button>

---

对齐

到<代码>右侧或

左侧

？两个

中心
？！我想将图像移动到与单词“close”相关的顶部，现在它们与底部对齐
<button type="button" class="btn btn-link colorGrey ne-cls">
<span class="fa fa-times icn-cls" style="margin-right: 2px; "></span> <span class="txt">Close</span> 
 </button>

.ne-cls {diplay:inline-block;}
.icn-cls{vertical-align:middle;}
.txt {vertical-align:middle;}