css - 为什么 90% 宽度的 div 左侧和右侧的 5% 填充不会给我 100% 的宽度？

Question

我在使用以下代码的移动网站 header 方面遇到了一个奇怪的问题:

padding: 10px 5% 10px 5%;
width: 90%;

这里可以看到效果-> http://cssdesk.com/vEMCY

包含此代码的 div 比没有填充且宽度为 100% 的 div 短一点。

我通过在页眉中的元素周围放置边距并取消填充并将宽度设置为 100% 来绕过它，但我很好奇为什么要这样做，因为我最后检查了 5 + 5 + 90 = 100.

Answer 1

基于 Webkit 的浏览器在百分比测量方面存在舍入错误。

不久前，我问了一个非常相似的问题，这似乎就是问题所在。引用:Chrome and it's handling of %s

详细说明问题的帖子 can be found here (最初由 bookcasey 分享)。