css - Bootstrap 3.0 将导航栏和 Logo 对齐到底部

Question

我目前在导航栏的右侧有一个 Logo (下面的代码) 我怎样才能让导航栏对齐到行的底部，而不是粘在顶部？ Logo 的高度高于导航栏，因此设置了行的高度

<div class="row">
    <div class="col-sm-10" id="nav-left">
        <div class="navbar-header">
            <div class="collapse navbar-collapse" id="tws-navbar-top">
                <ul class="nav navbar-nav navbar-top">
                    <li><a href="#" class="navbar-top-item">HOME</a></li>
                </ul> 
            </div>
        </div>
    </div>
    <div class="col-sm-2"  id="nav-right">
        <img class="img-responsive" src="image" alt="logo" />
    </div>
</div>

Answer 1

您可以将 margin-top 添加到您的 .navbar-header DIV。

边距的值等于 Logo 的高度减去 Bootstrap 中默认导航栏高度的 50 像素。

.navbar-header {
    margin-top: 20px !important; //if the logo has a 70px height.
  }

示例 here on bootply .