CSS 菜单仅在第一次悬停时移动

Question

我这里有一个 CSS 菜单 http://www.salvationarmyqc.org/

当我将鼠标悬停在菜单上时，它会移动，但仅在第一次发生悬停事件时发生。

之后，它就不动了。

我不知道为什么会这样。

Answer 1

你能发布你的CSS吗？

从外观上看，您正在设置悬停时的边框宽度，将菜单项向下推。您可以尝试使用绝对定位，并将顶部高度调整为 -1 或类似值。

例如，您的 css 可能看起来像这样。

#listContainer{position:relative;}
.listItem{position:absolute;top:0;}
.listItem:hover{top:-1;}

我不确定为什么整个导航菜单在 chrome 中向下移动而没有看到你的 css。

Answer 2

您的#navigation 正在从 34 像素的高度跳到 36 像素。您可以将其静态设置为 34 像素，或者将所有 li 的填充和边距设置为 0。