CSS3 Box Model behaviour

Paul Irish also discusses this in his blog post from Feb. 2012:

http://www.paulirish.com/2012/box-sizing-border-box-ftw/

Modded up, but I really hope most frontend folk on HN already know about border-box.

Short ver: float two 50% widths beside each other. Change padding as you like later and not have stuff break.

I have been doing this for a year now, it's godlike especially for in-browser design.

What I've been trying to figure out for years is when/why content-box would be a desirable state of affairs.

Most of the time, you know the border-box width (and probably the padding and border) want the browser to figure out the content-width, which is why the standard box model always seemed like a pain, because it makes you do that instead (assuming you're using units where that's even possible).

I'm trying to think of a situation where that'd be useful -- where it'd be helpful from a layout perspective to start with content-width -- so I could figure out what the w3 folks were thinking, but I've always had trouble with that. Has anybody figured this out?

Legacy IE got few things right, this was one of them.

For those of you who don't know, Bootstrap 3 uses border-box for everything by default. Anyone who has worked with front end design a bit has probably cringed many times at the thought of having to assign the full dimensions of the box you want to an outer div, then create an inner div with padding in order to achieve the same result that border-box solves. Didn't IE also invent @font-face?

Pretty surprised that this basic, well known style rule is front page. I guess it's not as well known as I thought.