Question

如果我有这样的导航栏：

<nav class="navbar navbar-fixed-top navbar-default">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <i class="fa fa-plane fa-3x navbar-text" aria-hidden="true" style="margin-bottom: 1.5%;"></i><strong class="navbar-brand">Test Site</strong>
        </div>
  </div>
  </nav>

飞机不在导航栏中居中，更不用说它位于旁边的文本中心。我已经尝试了内联边距，但似乎没有移动它。

如何做到这一点？

这是bootply。

Answer 1

您可以尝试仅为字体调整y轴边距..

  .fa.navbar-text {
    margin-top: 7px;
    margin-bottom: 7px;
   }

http://www.bootply.com/cIt2OwPoaG

在Navbar中垂直居中字体真棒图标

1 个答案: