Two Column Layout using the CSS3 Calc() Function

The width of the top-level wrapper is 75%. If we wanted to increase or decrease the width of this wrapper, we'd usually have to also adjust the width of the columns below each time to account for the padding.

Left Column

This column's width is set to 60% with a padding of 10px.

Right Column

This column also has a 10px padding. It's width is set to 40% minus the sum of both column's padding (10px padding * 4).

As you can see, using percentages is much easier when the browser itself can calculate the padding out of the width.