Html 下拉菜单出现在div之外的其他内容后面

我创建了一个使用javascript的导航菜单。我在主菜单的某些部分中有下拉菜单，但当我单击箭头时，它只会显示下拉菜单，直到div的末尾。参见图片：

如何获取它，使下拉列表显示在顶部。我尝试过溢出：可见，但这似乎不起作用

HTML:

---

您需要在子菜单标记中使用Z索引

ul.menu li ul.submenu {
z-index: 5000; // <-- ADD THIS
list-style: none;
position: absolute; 
left: 0; top: 35px;
background: #333;
margin: 0; padding: 0;
display: none;
float: left;
width: 170px;
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-bottomright: 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
border: 1px solid #111;
}

---

你需要位置：绝对；为了让它起作用，但是你已经在CSS中的这个类上有了它，我相信答案是z-index，但是z-index只对放置的元素起作用。如果你加上

ul.menu li ul.submenu {
    z-index: 5000;
    position: relative;

}确保溢出设置设置为：show

---

当我看到我的设置为隐藏时，我也遇到了同样的问题。

这里可能不是您的问题，但不要在属性名称=值对之间使用空格。IE应该读抱歉，我需要更清楚一点，我希望它向下移动，但它被切掉了，因为它下面的div，我不知道为什么…我们在截图中看不到它被切掉了，在HTML代码中没有其他div请更新问题以更好地描述和显示问题。谢谢

ul.menu li ul.submenu {
z-index: 5000; // <-- ADD THIS
list-style: none;
position: absolute; 
left: 0; top: 35px;
background: #333;
margin: 0; padding: 0;
display: none;
float: left;
width: 170px;
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-bottomright: 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
border: 1px solid #111;
}

ul.submenu {
    margin-top:-2em; // adjust me (use 'em' to scale w/ font size adjustments)
}

ul.menu li ul.submenu {
    z-index: 5000;
    position: relative;