爲什麼懸停推送內容？

Question

如果您將鼠標懸停在this website上的菜單上，您會看到內容被推下。我繼承了其他人的樣式表，這是一個完整的混亂。任何人都可以向我解釋爲什麼這個懸停在推低內容？

菜單內置如下：

li > ul class .sub-menu > li > a class .sub_menu_item

我看着position和display CSS，但我似乎無法找到任何異樣。任何幫助將不勝感激！

Answer 1

當我檢查懸停在'三列'div中的第一個li時，您可以檢查下拉列表並查看它是否繼承了默認的「position：'relative'」。

你想在ul class =「子菜單」上應用樣式「Position：'absolute'」，這將使它在自己的容器中有效，因此它可以大部分位於它想要的位置，控制其定位。這是除非它的父母有設置「位置：」相對'「，然後它會遵循包含單元的邊界）。

還擡頭 - 如果應用絕對位置，看起來您需要增加下拉單元格右側邊框半徑的寬度或其他值。

Answer 2

加入這行到你的CSS文件：讓他們留在文檔流顯示，當他們

#navigation ul.sub-menu{ 
    position:absolute; 
} 

Answer 3

的.sub-menu元素沒有給出一個位置。他們需要一個position: absolute將其從流中移除並防止內容轉移。