How do I center a table using CSS?
The correct way to center block elements, like tables, in CSS is to set the margins to this:
margin-left: auto; margin-right: auto;
or the shorthand:
margin: auto;
Unfortunately, this doesn’t work om IE 4 through 5.5 (and version 6 in “quirks” mode. To get around that, the body should have the style rule text-align: center, but this will center the text in compliant browsers, as a result you have to do this:
body { text-align: center; }
#centerItem { text-align: left; margin: auto; }
For an comprehensive investigation into the above, read “Centering Tables” by Nicholas G. Theodorakis.