<分区>
现有问题how-to-add-a-3rd-level-to-my-css-drop-down-menu在 jsfiddle 上有一个经典的代码片段和工作示例,以向原始海报展示如何做到这一点。结果如下所示:
但设计的一个小问题是第 3/4 级菜单固定在树的最顶部。如果它们在二级菜单中锚定到它们自己的“父级”,那就更好了。
我的意思是,如果您将 foo 和 bar 添加到菜单项 Level 2-A-4,如下所示:
<li><span>Level 2-A-4</span>
<ul>
<li><span>Foo</span></li>
<li><span>Bar</span></li>
</ul>
</li>
...那么他们应该卡在 Level 2-A-4 上,而不是锚定在顶部。
如何做到这一点?
最佳答案
像这样编辑这个类:
#menu > li > ul li:hover > ul{
display:block;
position:absolute;
left:100%;
border-left:solid 3px #fff;
top:inherit; /*changed*/
margin-top:-29px; /*added*/
width:auto;
}
关于html - CSS 下拉菜单中的第三级需要更智能的垂直对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19228676/