Twitter Bootstrap nav摺疊下拉菜單是重疊的內容？

我正在使用基於Twitter Bootstrap的模板來創建我正在構建的網站（鏈接：rwphoto），但我在移動下拉菜單中遇到了一些問題。如果我將navbar-inner div更改爲194像素以適合我使用的重複圖像的高度，它會重疊而不是將內容向下推。我只是不確定爲什麼這是一個問題。我環顧四周，但似乎無法找到解決辦法。Twitter Bootstrap nav摺疊下拉菜單是重疊的內容？

此外，我將如何將.brand元素（徽標）放在移動設備中，而不是將它放在左側？我如何獲得垂直居中的導航鏈接，並在標識和屏幕右邊緣之間水平移動？

嘆息 ...很抱歉，第一次使用引導，很明顯...：/

來源

2012-07-16 Justin W

即使我將鼠標懸停在導航鏈接上，我也沒有看到下拉菜單。 – 2012-07-16 04:13:29

如果您調整瀏覽器的大小（或者如果您在移動設備上查看它），將會出現一個包含三行的按鈕。這是菜單按鈕。點擊那個。 – 2012-07-17 20:32:31

定心標誌，實現這個CSS代碼到被稱爲類...

.container { position:relative; }  
.brand { text-align: center; width: 97%;} 

.navbar .btn-navbar { 
    display: block; 
    position: absolute; 
    right: 0; 
}

對於居中的導航鏈接，

.nav-collapse .nav > li > a { 
    margin: 12px 0 !important; 
    text-align: center; 
}

而對於下拉覆蓋問題，添加此，

.nav-collapse { padding-top: 1em; }

來源

2012-07-16 06:36:54 SaurabhLP

檢查這個鏈接，你可以自定義，如你所願...... http://css-tricks.com/snippets/css/media-queries-for-standard-devices/ – SaurabhLP 2012-07-18 05:19:43

我的意思是我想標誌居中一次它已經切換到768px寬。它應該留在更寬的屏幕左側。我對媒體查詢相當陌生，但我想這是他們進來的地方，是的？我嘗試了上面的代碼，但鏈接並不真正在導航欄中垂直排列，並且在徽標右側的屏幕之間水平排列。另外，'padding-top'設置爲'1em'似乎沒有辦法。 :( – 2012-07-18 05:31:29

啊！我在Twitter的官方頁面上查看了'.navbar-inner'的代碼，高度由'min-height'，** not **'height'設置，簡單的錯誤我改變了'.navbar-inner'到'min-height：194px'，那就做到了！所以，現在唯一的問題是使用媒體查詢標識，然後讓這些鏈接以正確的方式居中。 – 2012-07-18 06:01:58

Twitter Bootstrap nav摺疊下拉菜單是重疊的內容？

回答

相關問題