css - 100% + padding?

Question

As most people know,

a 100% div with a 5px padding is actually 100% + 10px wide.

One obvious solution to this is to wrap the child div in a wrapper that has

Answer 1

You should look into the box-sizing CSS property...

• http://www.w3.org/TR/css3-ui/#box-sizing
• https://developer.mozilla.org/en/CSS/box-sizing

I put together an example to show you how this works and the difference between having the box-sizing property and not having it. Check out the fiddle...

http://jsfiddle.net/UnsungHero97/bKsad/2/

Note that this won't work in IE7 or below :/

I hope this helps.
Hristo