以Bootstrap爲中心的響應式導航欄

Question

實現我想要的響應式引導欄導航欄時遇到了一些麻煩。

我對bootstrap/css很新，而這個jsfiddle http://jsfiddle.net/YfmwV/是我迄今爲止一起入侵的東西。這個問題與下面的代碼有關，後者在大屏幕視圖中實現了我的功能，但是在響應模式下完全破壞了菜單。

.navbar .nav>li { 
    width: 12.5%; 
} 

我試圖讓導航欄項目採取了導航欄的整個空間，而不是被對齊或左或右，只有這樣我能想到這樣做是爲了設置寬度爲百分比，這並不理想。

如果有人能指出我的方向真是太棒了，

Answer 1

你可以使用一個@media查詢，使您的寬度：12.5％僅適用於桌面模式..

CSS

@media (min-width: 979px) { 
    .navbar .nav>li { 
     width: 12.5%; 
    } 
} 

Answer 2

我並不完全理解你的意思，但就我所能理解的而言，你希望懸停和活動效果在任何一邊都沒有任何填充/邊距。

Navbar-inner具有20px左右的填充，如果將它們設置爲0，則該欄將佔用菜單的全部寬度。

.navbar-inner { 
padding-right: 0; 
padding-left: 0; 
} 

這是你的意思嗎？