What is the advantage of W3C box model compared with IE5 box model?

Question

I think the IE5 box model is more similar to human's logic about box's concept,withing including padding and border.It can defined the box width and height directly.

In cases in which you have an element with a width of 100%, the IE5 box model allows you to add padding and borders safely. Compare this to the correct CSS box model, in which you cannot add any padding or borders to an element with a width of 100% without breaking the layout

So any one could explain it in details?What is the W3C box model advantages?

Thank you

Answer 1

The 100% example is sometimes a valid issue with the W3C box model, however it is mostly a moot point because you can use the following code and achieve what you are referring to as the "IE 5 box model":

box-sizing: border-box;

/* probably not needed in 2016 */
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;

box-sizing is available in all major browsers IE8+. I use it exclusively now; Microsoft had this one right, in my opinion.

Also See

• Why is the W3C box model considered better?