水平'子菜單'導航

我正在建立一個網站，從設計發送給我，但無法確定如何創建水平子菜單。如果您現在查看網站，您會看到ABOUT菜單項包含虛擬子頁面/鏈接。子菜單垂直下降。我怎樣才能讓它像附加的截圖一樣是水平的？水平'子菜單'導航

這裏是的jsfiddle：jsfiddle.net/huwrowlands/2sQbn（基本代碼）

由於在li元素

enter image description here

使用display:inline-block;或float:left;。就像你在另一個ul上一樣。

e.g：

.nav ul li ul li {float: left}

或

.nav ul li ul li {display:inline-block;}

2014-01-15 14:06:45 Albzi

寬度嘗試這樣做。問題是孩子被父寬度所包含。所以子菜單不會比'about'li的寬度更遠。 –

http://jsfiddle.net/huwrowlands/2sQbn/ –

您需要浮動元素中的下拉菜單。

.nav ul li ul li {float: left}

和刪除從.SUB菜單

2014-01-15 14:09:25 giker

試過這個。問題是孩子被父寬度所包含。所以子菜單不會比'about'li的寬度更遠。 –

複製你的標記和CSS在這裏http://jsfiddle.net – giker

http://jsfiddle.net/huwrowlands/2sQbn/ –

回答