說到 box-sizing不能不提IE 的一個 bug，IE對盒模型的解析問題，w3c規定的標準模式，盒模型站的空間是由 content + padding+ border+margin相加的來。而在IE的怪異模式下盒模型站的空間是由 content +margin相加的來，也就是說。在我們開發的過程中會發現，有時候，如果對頁面中的大區域進行設置時，將border、padding計算到width和height之內，反而更靈活。但W3C的 規範卻規定了他們並不能被包含其中。爲了解決這個問題，css3中引入了一個新的屬性：box-sizing，它具有“content-box”和”border-box“兩個值。
box-sizing:content-box
當我們設置 box-sizing: content-box; 時，瀏覽器對盒模型的解釋遵從我們之前認識到的 W3C 標準，當它定義width和height時，它的寬度不包括border和padding。
box-sizing:border-box
當我們設置box-sizing: border-box; 時，瀏覽器對盒模型的解釋與 IE6之前的版本相同，當它定義width和height時，border和padding則是被包含在寬高之內的。內容的寬和高可以通過定義的“width”和 “height”減去相應方向的“padding”和“border”的寬度得到。內容的寬和高必須保證不能爲負，必要時將自動增大該元素border box的尺寸以使其內容的寬或高最小爲0。
