使用自舉導航欄我無法使摺疊模式下的菜單項成爲100％。出於某種原因，菜單項的一側有餘量。摺疊的菜單項不是100％的寬度與Bootstrap 3

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

<div class="navbar navbar-default navbar-static-top" role="navigation"> 
    <div class="container"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse"> 
     <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 navbar-header-brand-collapsed" href="#"><i class="fa fa-bus"></i> Project name</a> 
    </div> 
    <div class="collapse navbar-collapse"> 
     <ul class="nav navbar-nav nav-justified"> 
     <a class="navbar-brand navbar-brand-collapsed" href="#"><i class="fa fa-bus"></i> Project name</a> 
     <li class="active"><a href="#">Home</a></li> 
     <li><a href="#about">About</a></li> 
     <li><a href="#contact">Contact</a></li> 
     </ul> 
    </div><!--/.nav-collapse --> 
    </div> 
</div>

和一些CSS：

@media (min-width: 767px) { 
    .navbar-nav.nav-justified > li{ 
     float:none; 
    }   
    .navbar-header-brand-collapsed { 
     display:none; 
    } 
} 

@media (max-width: 767px) { 
    .navbar-header-brand-collapsed { 
     display:block; 
    } 
    .navbar-brand-collapsed { 
     display:none; 
    } 
}

來源

2014-09-02 JavaCake