css - Bootstrap 子菜单放置错误

Question

第二级子菜单放置在第一级子菜单的第一个元素旁边，当第一级子菜单的较低元素具有较少的第二级子菜单元素时，由于鼠标悬停消失，用户无法导航到新的第二级子菜单出菜单。

如何将二级子菜单放置在每个一级子菜单的选定元素旁边？

这是 JSFiddle，检查元素并尝试导航到它们的子菜单:存储设备、打印机、笔记本电脑包、投影仪等。

HTML

Code too large to be displayed here. Check JSFiddle

谢谢!

Answer 1

只需添加这条规则:

.dropdown-menu > li { position: relative; }

你需要的是第一级子菜单有position: relative，这样当下一级定义position: absolute; top: 0; 它的顶部是直接父级的顶部。