Navbar按鈕只能在較小的屏幕上右移

Question

我正在嘗試設置導航欄，以便左側有一個品牌圖標（當前只使用佔位符文本），導航欄右側有兩個按鈕。 Here is the JSFiddle showing this。

我遇到的問題是，這在小屏幕上按預期工作，但是當我的瀏覽器是全尺寸的時候，一切似乎都向左拉。有沒有我失蹤的課程？

<nav class="navbar navbar-default navbar-static-top"> 
    <div class="container"> 
    <div class="navbar-header"> 
     <a class="navbar-brand" href="#">Business Name</a> 
     <form class="pull-right"> 
     <button type="button" class="btn btn-default navbar-btn btn-xs" data-toggle="modal" data-target="#signInModal"> 
      Sign In 
     </button> 
     <button type="button" class="btn btn-default navbar-btn btn-xs" data-toggle="modal" data-target="#signUpModal"> 
      Sign Up 
     </button> 
     </form> 
    </div> 
    </div> 
</nav> 

Answer 1

一些Bootstrap希望存在的div缺少以及移動漢堡菜單。嘗試更多的東西一樣：

<nav class="navbar navbar-default"> 
    <div class="container-fluid"> 
     <!-- Brand and toggle get grouped for better mobile display --> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span> 
<span class="icon-bar"></span> 
<span class="icon-bar"></span> 
<span class="icon-bar"></span> 
      </button> <a class="navbar-brand" href="#">Brand</a> 
     </div> 
     <!-- Collect the nav links, forms, and other content for toggling --> 
     <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
      <form class="navbar-form navbar-right" role="search"> 
       <div class="form-group"> 
        <button type="button" class="btn btn-default navbar-btn">Sign in</button> 
        <button type="submit" class="btn btn-default">Submit</button> 
       </div> 
      </form> 
     </div> 
     <!-- /.navbar-collapse --> 
    </div> 
    <!-- /.container-fluid --> 
</nav> 

小提琴： http://jsfiddle.net/njkcaqvu/