#menu {
width: 1001px; height: 34px;
padding: 0; margin: 0;
background-color: #d9e4ea;
}
#menu ul {
float: left;
padding: 0 20px 0 203px; margin: 0;
list-style: none; line-height: normal;
}
#menu a {
display: block; border: none;
margin: 0 47px 0 0; padding: 5px 9px 4px 9px;
text-decoration: none;
font-size: 18px;
}
正如您在 Chrome 的 fiddle 中看到的那样,menu
容器的高度是 34px 而 ul
的高度是 30px 所以当我悬停
link
有一个 4px 宽的空间。但是,如果我在 Firefox 中打开它,ul
的宽度为 32px,而我只有 2px 的空间。我尝试调整每个对象的填充但没有运气。那么,为什么 Firefox 会窃取我的 2 个像素?
最佳答案
您的问题在于line-height:normal
。两种网络浏览器都有不同的常态概念 :)。
将行高设置为相对值(即 1.2
)或绝对值(即 20px
),渲染效果相同。
关于html - Firefox 窃取 mah 像素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23172418/