css - 级联 CSS 菜单中的溢出问题

Question

我有一个简单的基于 CSS 的下拉菜单，它运行良好。但现在我想添加一个也会显示的子菜单。一切正常，除了在显示子菜单时主菜单列表的高度在扩展。

http://jsfiddle.net/GzfFs/

.cascade_content {
/* cascading sub menu */
display: none;
z-index: 103;
position: relative;
background: #FFFFFF;
border: 1px solid #8C8C8C;
padding: 10px 0px 10px 0px;
width: 190px;
left: -192px;
top: -26px;
-moz-box-shadow: 0 2px 6px 0px #8C8C8C;
-webkit-box-shadow: 0 2px 6px 0px #8C8C8C;
box-shadow: 0 2px 6px 0px #8C8C8C;

注意:似乎是子菜单中的 position:relative 导致了这个...但是，将其更改为 position:absolute 会导致它没有出现在正确的位置的问题。我相信那些拥有更多 CSS 经验的人会认为这是一个简单的问题 - 感谢您提供的任何帮助!

Answer 1

http://jsfiddle.net/GzfFs/1/

.dropdown_content li {position: relative}
.cascade_content {position: absolute}

您可能还需要将 UL 移动到 LI 内，以便定位到您想要的位置。