引导子菜单放置错误

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; 时，其顶部就是直接父级的子菜单。