往往你设置的元素宽度，是内容content的宽度，没有算上padding，border，margin的宽度的，如下

谷歌调试：

元素的总宽度就是margin+border+padding+content

所以如果两个元素设置一样的高度宽度，padding不一样，这两个元素的大小也是不同的。

举栗子：

粗问题了，那我想fancy的内容距离边框远一点，但是总宽度和simple的一样，又懒得算要设置多大，用到CSS3的box-sizing，效果如下：

新simple，新fancy设置的宽度为500，该宽度是内容+border的宽度+padding的宽度。

新simple

新fancy

有了box-sizing，就不用算啦。

我懒，所以以后的代码是

* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}

就不用再去重复写了，美滋滋。