导航下拉保持元素向下推动

Question

导航栏出现问题。当它下降时，它似乎继续推动名为.banner-left和.banner-right的类。

我把我的代码放在JSfiddle上，因为我正在为一个项目做这个，并且必须使用哈佛引用，所以即使工作没有在其他地方浸出，这些来源也会增加抄袭百分比。

Link: http://jsfiddle.net/wuqa5y87

Answer 1

您应该将下拉列表position设置为absolute。

UPDATED FIDDLE

nav ul ul {
    display:none; 
    position: absolute; }

Answer 2

你可以尝试添加position：absolute到nav ul li：hover＆gt; UL

nav ul li:hover > ul  { 
    display:block; 
    position:absolute;
}

Answer 3

这是一个更新小提琴的链接：看起来像你的原始（最后缺少圆形边缘 - 但你可以弄清楚如何让它们回来我肯定）

http://jsfiddle.net/wuqa5y87/2/

nav ul ul {
    position: absolute;
}

nav ul ul li{
    position: relative;
    clear: both;   
}

Answer 4

正如其他人所说的那样，你需要对所显示的UL元素进行绝对定位，因为它会将其从文档的正常流程中取出。

我在这里更新了你的小提琴 http://jsfiddle.net/ryanore/wuqa5y87/3/

你还需要一点额外的按摩才能正确

nav ul { 
    text-align:center; 
    margin:auto; 
    position: absolute;

}

nav ul li ul{
  width: 175px;

}