Bootstrap 导航栏和字体问题

Question

我想在导航栏中添加很棒的字体 bootstrap 但它显示了此类问题

我的问题是我想使用更大的图标，但它不是居中对齐的

我可以通过为图标提供绝对位置和为文本提供额外的左边距来解决这个问题。但是有什么合适的解决办法吗

Answer 1

使用这个

<li class="active"><a href="#"><i class="fa fa-plus"></i> <b>Create New</b></a></li>

你用class="fa fa-plus fa-2x"class那为什么这个显示更大。

Answer 2

只需在您的 html

中替换以下行

<li class="active"><a href="#"><i class="fa fa-plus"></i> <b>Create New</b></a></li>

fa fa-plus fa-* 图标大小改变，但您的情况不需要使用。

Answer 3

将vertical-align: middle;添加到图标class:

.fa-2x{
    vertical-align: middle;
}

查看更新DEMO

Bootstrap nav bar and font awesome issue