javascript - Bootstrap 不向右拉

Question

我对学习 bootstrap 还很陌生，我刚刚完成了我的“导航栏”。

但我很困惑，每当我尝试向右拉我的无序列表时，它就停留在中间？请帮忙，我很困惑..

HTML:

<div class="navbar navbar-default navbar-fixed-top">
    <div class="container">
        <div class="navbar-brand">
            <a href="#">
                <img class="nav-img" src="img/span-img.png" />
            </a>
        <button class="navbar-toggle" data-toggle="collapse" data-target=".navHeaderCollapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <div class="collapse navbar-collapse navHeaderCollapse">
            <ul class="nav navbar-nav pull-right">
                <li><a href="">HOME</a></li>
                <li><a href="">ABOUT</a></li>
                <li><a href="">CAREERS</a></li>
                <li><a href="">CONTACT US</a></li>
                <li><a href="">ADVERTISING</a></li>
            </ul>
        </div>
        </div>
    </div>
</div>

CSS:

.navbar{
  background-color:#282828;
  height:83px;
  margin-top:0px;
}

.navbar .nav-img{
  height:77px;
  width:108px;
  margin-top:-12px;
}

Answer 1

为 div 尝试 pull-right 而不是 ul 像这样: Demo

 <div class="collapse navbar-collapse navHeaderCollapse pull-right">
    <ul>..</ul>
  </div>