Question

我有一个项目，当在IE7中悬停时导致下面的项目稍微移动。

您可以在此处查看相关项目：http://andovertowncouncil.customstudio.co.uk/

在右侧边栏中，每个项目都有一个H2标题。当您将鼠标悬停在IE7上时，下面的项目会向下移动2/3像素。如果您将鼠标悬停在其他内容（如按钮）上，则此较低项会返回其原始位置。

我试图对我的悬停效果非常具体：

.right-item h2 a:hover {
margin-bottom: 5px;
border-bottom: none;
padding-bottom: 0;
text-decoration: none;
line-height: 30px;
}

但没有成功。

如果有任何关于如何解决这个问题的建议，我将不胜感激？

提前致谢，

汤姆

Answer 1

无法说明为什么要在悬停时添加以下规则，但它们会导致您的内容发生变化：

.right-item h2 a:hover {
    border-bottom: medium none;
    line-height: 30px;
    margin-bottom: 5px;
    padding-bottom: 0;
    text-decoration: none;
}

a:hover {
    border-bottom: medium none;
}

如果删除所有浏览器中的所有内容都很好。

Answer 2

您在悬停时添加margin-bottom。

尝试删除它，看看它是否解决了您的问题。

在IE7中悬停时项目略有移动

2 个答案: