HTML - 菜单项在 90% 和 110% 缩放时缩小一个像素

Question

我为我工作的公司更新网站内容(不是通过 CMS)。我绝不是专家，但可以满足我们的需求。 http://www.surreyilc.org.uk是网站。

我最近看到在定位第一个顶部栏菜单项(HOME/WHO WE ARE)时出现错误，并且无法弄清楚为什么会发生这种情况。

当您在 Chrome、Firefox 和 IE 中以 90% 和 110% 缩放时，菜单项的位置比应有的位置高出一个像素。所有其他缩放量都不会显示此定位错误。

谁能告诉我它为什么这样做，以及可能的修复方法吗？

非常感谢您。

Answer 1

删除菜单项的高度和填充顶部并使用下面的样式

a.navitem, a.navitem:link, a.navitem:visited, a.navitem:active
{
    ...
    height: 35px;
    line-height: 35px;
}
a.navitem.double, a.navitem.double:link, a.navitem.double:visited, a.navitem.double:active
{
    ...
    line-height: 16px;
}