header {
Box-sizing:border-Box;
-moz-Box-sizing:border-Box; /* Firefox */
-webkit-Box-sizing:border-Box; /* Safari */
padding:10px;
width: 960px;
margin: 0 auto 0 auto;
height:80px;
display:table;
background-color:#FFF;
}
我正在使用上面的CSS代码,在Chrome和Firefox中,这使得标题的总宽度为960px,但是在我的Safari 6.02中,它应该只支持“Box-sizing”,而不需要前缀,但我放了一个无论如何,作为一个后备,我的总宽度为980px,这意味着它的大小取决于内容框.谁能告诉我为什么它不适合我？
解决方法@H_502_8@
您正在标题上使用display：table.这似乎触发了一些额外的填充.添加边框折叠：折叠似乎解决了它：
http://jsfiddle.net/7Yhwb/1/(不包括：
http://jsfiddle.net/7Yhwb/)
编辑：我认为这是Safari 6.0.2正在使用的WebKit版本(536)中的一个错误.在使用WebKit 536的旧版Chrome 20中,该错误也存在.
在最近使用WebKit 537的Chrome版本中,似乎已修复.
要解决您的问题,我会切换到display：block.
编辑：我认为这是Safari 6.0.2正在使用的WebKit版本(536)中的一个错误.在使用WebKit 536的旧版Chrome 20中,该错误也存在.
在最近使用WebKit 537的Chrome版本中,似乎已修复.
要解决您的问题,我会切换到display：block.
