在Bootstrap 3

Question

我希望我的导航栏列表项跨越页面的整个宽度，但是要合理。我尝试了Morgen32在这个问题中的第二个答案：How to justify navbar-nav in Bootstrap 3

    @media (min-width: 768px){
    .navbar-nav {margin: 0 auto; display: table; table-layout: fixed; float:none; width:100%;}
    .navbar-nav > li {display:table-cell; float:none; text-align:center;}
} 

然而，较长的项目会转到两行，而且也不会使用页面的整个宽度。

http://jsfiddle.net/xt7Laawd/2/

提前感谢您的帮助！

编辑：我编辑了小提琴。这不是正确的。

Answer 1

好的我明白了。事实证明我必须将table-layout更改为自动而不是固定。

@media (min-width: 768px){
    .navbar-nav {margin: 0 auto; display: table; table-layout: auto; float:none; width:100%;}
    .navbar-nav > li {display:table-cell; float:none; text-align:center;}
}