IE盒模型和CSS3中box-sizing属性

• 标准盒模型–margin+border+padding+content
• IE盒模型–margin+content（IE5.5及更早）

IE盒模型中，content的宽高包含border和padding

改变padding和border时，对布局的影响

• 标准盒模型下，改变border和padding都会使整个box的宽高改变。
• IE盒模型下，一旦设置了width和height，无论改变padding和border为多少，只要在总宽度和高度的承受范围内，都不会改变大小，当然，值太大时会溢出

如果把标准盒模型下的box放到IE盒模型下，就会打乱布局，少掉了border和padding，因为他们被width和height包含进去了

如果需要统一标准，可以使用box-sizing属性
box-sizing: content-box | border-box | inherit;

属性值
content-box	默认属性，标准盒模型
border-box	使用IE盒模型
inherit	继承父类的box-sizing属性值

浏览器兼容

浏览器	支持属性名
Chrome/Opera/IE	box-sizing
FireFox	-moz-box-sizing
Safari	-webkit-box-sizing