CSS下拉菜单 - 重叠元素

Question

我已经制作了一个下拉菜单但是当我将鼠标悬停在父类别上时，这些孩子看起来很拥挤且重叠。似乎儿童的“元素”并没有整齐地放在另一个之下;相反，它们相互重叠。

我自己尝试修复它并查看谷歌和这里，但我没有找到解决此问题的任何解决方案。我也读过“内联元素和填充”指南，但它对我没有帮助。我不是程序员，我只是在做一些购买主题的定制（http://meros11.gostorego.com/）。

任何帮助都将不胜感激。

我是否需要发布所有代码，或者您是否可以使用开发人员工具自行查看？ （例如在Chrome中）

谢谢！

Answer 1

这个类适用于所有菜单元素：

#nav li.parent a span {
    margin-top: -10px;  /* This is what's making them crowded */
}

查看导航菜单的样式，此样式应仅适用于顶级li元素（示例类别，族树，婚姻），但它适用于您的所有a元件。

我会将此id的名称更改为class（删除＆＃34; #nav li.parent a span＆＃34;并替换为＆＃34;。[您的班级在这里命名]＆＃34;然后将该类应用于顶级li元素（示例类别，家谱，婚姻）。

更改

<li class="level0 nav-1 level-top first parent hasProducts">

到

<li class="level0 nav-1 level-top first parent hasProducts [YOUR CLASS HERE]">

然后在你的CSS中：

变化

#nav li.parent a span {
    margin-top: -10px;
}

到

.[YOUR CLASS HERE]{
    margin-top:-10px;
}