从父<li>失去焦点时，CSS下拉消失</li>

Question

我已经阅读了类似问题的回复，我相信我已经尝试了上面提到的步骤，但是当鼠标关闭时，我的下拉菜单仍然存在问题。

我删除了下拉列表的格式，因此代码很简单，请看一下：

http://freerange.wesleypearce.co.uk

如果你将鼠标移到过去的作品上，你就会看到我的问题。

提前感谢可能是一个非常简单的解决方案，它只是暗指我！

干杯，

韦斯。

Answer 1

在style.css第89行试试这个

我已经改变了ul的最高位置。问题是您的a tag（过去的产品）和下拉列表ul之间存在差距

#menu ul ul {
    margin: 0 auto;
    position: absolute;
    top: 40px;
    visibility: hidden;
    width: 90px;
}

Answer 2

在您的下拉菜单规则中，使用padding-top: <#>px;而不是top: 45px;在菜单标题和列表之间添加间距。 top值不应超过菜单标题的高度，否则您将在列表和列表之间创建一个间隙，一旦光标移动，就会删除列表的可见性在标题上和差距上。

Answer 3

您将子菜单推离主菜单项太远，只需声明100%将子菜单推到主菜单项的正下方即可解决问题：

#menu ul ul {
    top: 100%; /* fix */
}