Bootstrap導航欄摺疊垂直關閉屏幕'cuz nav-pills內容的大小太大

Question

所以，我的導航欄摺疊垂直在我的頁面左側，當我點擊nav-pills菜單內容顯示在它們的正下方，但是，它有太多的信息，它會在屏幕外顯示，我有一個像13個元素的藥片，它位於頁面的最底部，幾乎所有的信息都離開屏幕，我可以做些什麼來使其向上或使其餘的內容固定在容器的底部，並且打開的藥丸有一個滾動條，這樣我就可以在它們之間導航。

導航欄是有點兒像這樣：http://www.bootply.com/0TBt8gDdsr

我需要其他藥片不會熄滅屏幕，裏面任何一個菜單至少有一個小名單的滾動條或有點，我可以瀏覽網頁時不佔用太多空間，有誰知道我該怎麼做？謝謝。

對不起，我的英語不好。

Answer 1

你會想一些額外的修修補補，使過渡更平滑，但只解決了大菜單的問題，應用以下CSS：

#cadastros-menu { 
    height: 200px; 
    overflow-y: auto; 
} 

這將導致你的第一個菜單（一個具有10個以上的鏈接）具有固定的高度和滾動條。不幸的是，Bootstrap的JS做了火，讓它一直向下擴展，然後跳回到固定高度。

此外，您需要調整您的.nav。你會希望它有一個指定的寬度，並且你會想用display: block來代替table-cell，這樣你就可以有全角的鏈接。

.nav上的固定寬度將有助於保持下拉菜單的滾動條不出現在屏幕的最右側。全寬鏈接只是很好的用戶界面。