2012-01-26 267 views
1

我使用純CSS菜單here純CSS下拉菜單問題

工作正常,但我想把創建的菜單放到另一個div區域,在頁面上劃一個橫條。

這隻能如果我把溢出本節:

#nav{ 
    list-style:none; 
    margin-bottom:10px; 
    margin-left:30%; 
    width:100%; 
    overflow:auto; 
} 

這則停止下拉酒吧工作。

任何想法如何解決這個問題?

回答

2

爲了能夠省略overflow:auto/hidden;你有幾種選擇:

使用一個固定的高度上#nav(或股利),以使其擴展到兒童的同一高度(潛在的危險:如果您沒有固定的高度對孩子li s工作,你可能不知道他們的確切高度(=通過字體大小,行高和boxmodell計算的話))

使用clear:left;#nav,無論是在的幫助下僞元素(要小心,即< = 7!)或在周圍的div (described here)中附加一個元素。

<div id="wrapper"> 
<ul id="nav"> 
    <li></li> 
    .... 
</ul> 
<div style="clear:left;"></div> 
</div> 
-1

我想試試這個:

變化:

overflow: auto; 

到:

overflow: visible; 

或者,如果你喜歡這個更好看,有一個滾動條,

變化:

overflow: auto; 

要:

overflow: scroll; 

這些兩種選項之一將幫助任何文本丟失的客戶視圖。這取決於你想要的樣子,以及你正在使用多少空間。但是這兩種選擇中的任何一種都是可行的。希望這可以幫助。

+0

-1:你明白這個問題嗎?你測試了你的代碼嗎? – Christoph

+0

我有可能誤解了這個問題,但我不必去測試它;我用它。他們在css-tricks.com上有相同的東西。 –

+0

沒有理由downvote我。如果你已經測試了這個,你會注意到,這不會起作用... – Christoph

1

我不確定你到底想要達到什麼目的,爲什麼你需要在這個例子中使用溢出?你能修改t his example嗎?

如果只是爲了清除浮動,您可以使用clearfix(ie6 +)。

+0

他的問題有點令人困惑,但前段時間我也有同樣的問題。如果你想有一個「酒吧」,用一些bg顏色說,那麼你需要清除浮游物或使用隱藏的溢出或在父元素上使用固定的高度,否則它將崩潰並具有0高度。 – Christoph