部署導航菜單 - 背景的CSS麻煩

Live site.部署導航菜單 - 背景的CSS麻煩

我有一個部署導航菜單，其中（理想情況下），第一組按鈕的應在任一側上具有的#00010420px。在「關於」和「屬性」上方懸停後，展開會繼續執行#000104後面的擴展選項。

雖然限制第一組按鈕的大小有困難。做這個的最好方式是什麼？（我的主要問題是每個按鈕是一個不同的長度 - 關於，博客，聯繫方式，屬性，如何動態地大小的背景顏色？）

jsfiddle.

ideal image

來源

2013-02-17 AMC

你是什麼意思是什麼呢？「限制第一組按鈕的大小」或「確定背景顏色的大小」是什麼意思？請解釋更多 – Roy 2013-02-17 21:52:14

@羅伊我會附上一張圖片來展示我的意思。謝謝。 – AMC 2013-02-17 21:56:42

你想用background: #000104上a標籤，而不是ul標籤。這樣，顏色不會擴展到無序列表的整個寬度;它只會延伸到a文本。此外，爲了讓按鈕在每一側都伸出更多，請在左側和右側添加20px的padding。

nav ul li a { 
    background: #000104; 
    padding-left: 20px; 
    padding-right: 20px; 
}

JS Fiddle Example

來源

2013-02-17 21:59:43 JSW189

感謝您對此問題的幫助。它與我正在尋找的東西非常接近，但是現在，當我將鼠標懸停在「關於」上時，例如，隨着部署選項的擴展，「關於」一詞消失。我該如何糾正這一點？例如，請參閱更新的jsfiddle。 http://jsfiddle.net/498qm/2/ – AMC 2013-02-17 22:13:18

沒問題！只需在您的展示菜單中將「padding-left」更改爲「margin-left」即可。他們的背景是覆蓋「關於」和其他菜單項。 [見這更新的JS小提琴]（http://jsfiddle.net/498qm/3/）。 – JSW189 2013-02-17 22:16:27

完美，謝謝！ – AMC 2013-02-17 22:22:10

部署導航菜單 - 背景的CSS麻煩

回答

相關問題