IE5.5及更早的版本使用的是IE盒模型,在在IE6及以上版本的浏览器中,浏览器支持一种解决了这种差异的可选的渲染模式,也开始遵循标准模式。
IE盒模型和W3C盒模型的差异:
IE盒模型,块元素的实际宽度=width(包含padding和border);
W3C盒模型,块元素的实际宽度=width+padding+border;
而IE盒模型的出现条件:
IE5.5之前版本
IE怪异模式(文档声明缺失或不完整;文档类型为HTML3之前的版本;使用HTML 4.0 Transitional或Frameset的文件类型描述且系统标识符(URI)不存在时;在DOCTYPE声明之前出现SGML注释或者其它无法识别的内容时;文档任何地方有错误时;注释符相遇时出现末尾文字重复;Internet Explorer 6在DOCTYPE声明之前出现XML声明)
在支持box-sizing的浏览器中使用box-sizing:border-box;