2012-04-14 102 views
1

我想知道如何定位一個CSS下拉(x軸)。目前,它看起來像這樣:CSS多級下拉菜單位置下一級

頂級(鼠標懸停這似乎)

  • 第二級
  • 二級(懸停)
  • 二級

當你將鼠標懸停在第二層上方,第三層出現在其下方,我如何定位它,使其每次位於旁邊?謝謝:)

的jsfiddle:http://jsfiddle.net/YgYtL/

回答

1

我在CSS中使用此代碼更新的jsfiddle

#navMenu ul li ul li:hover ul{ 
    top : 0; 
    left : 100%; 
} 

它在這裏:http://jsfiddle.net/YgYtL/16/

+0

你不是真的想在懸停時定位一個元素,它應該留在主元素聲明上。 – 2012-04-14 13:44:01

+1

如果他有多個第三級項目,他還應該更改#navMenu ul ul ul li,刪除位置,顯示和浮動。目前他們因絕對位置而粘在一起。 – dennisg 2012-04-14 13:44:04

1

目標從第二等級要素的左側,這應該是你的第二個級別下拉的整個寬度,像這樣的第三級下拉和位置正好是100%:

#navMenu ul ul ul { 
    left: 100%; 
    top: 0; 
} 

演示:http://jsfiddle.net/YgYtL/24/