Centering in the Viewport with CSS
Modern Browsers
This very simple, really. We make the <div
id="wrapper"> element
{display: table;}, and set height to
100%. A container, <div id="cell"> is
set to {display: table-cell;} and
encloses the entire page.
Obsolete Browsers
IE≤7 does not
grok the table group of display property values.
Fortunately(?), there's a bug in its support of the
position property we can take advantage of. Be sure to use
the conditional comments to feed IE, because
Microsoft promises that
IE8 will be fully CSS compliant. IE8 is highly
compliant.
