假設有個 element:
- 代碼: 選擇全部
<div style="width: 200px; margin: 5px; padding: 5px">Some Text</div>
W3C:個 box 有 210px 咁闊;Internet Explorer:exactly 200px 咁闊。
你邏輯上面,你覺得邊個會更貼近設計師既原意?我覺得 IE 嗰個係。
因為 IE 既 width 真係 exactly 個 box 個 width,padding 會計埋喺入面。
而 W3C 標準就係計內容既 width,padding 係計個 width 既出面。
唔明?睇埋下面幅圖就會明(轉自維基百科)
http://en.wikipedia.org/wiki/Internet_E ... _box_model
呢一段我幾認同
Douglas Bowman 及 Ethan Marcotte 寫: ... the original Internet Explorer box model actually represents a better, more logical approach based on common sense.
Peter-Paul Koch 寫: ... a physical, real-world box, whose dimensions always refer to the box itself, including potential padding, but never its content.
Peter-Paul Koch 寫: ... is more useful for graphic designers, who create designs based on the visible width of boxes rather than the supposed width of their content
本來 W3C 諗住加 box-sizing、box-width 同 box-height 3 個屬性,不過最後無加…
其實我希望加,咁樣設計就會有多啲彈性。