Centering: Auto-width Margins

By setting its right and left margin widths to "auto", it will make the content box horizontally centered. This is the preferred way to accomplish horizontal centering with CSS, and works very well in most browsers with CSS2 support.

Unfortunately, IE5/Win does not respond to this method. The workaround is to set the text-align to center.

Margin example:

h1 {margin: 10px}
all four margins will be 10px

h1 {margin: 10px 2%}
top and bottom margin will be 10px, left and right margin will be 2% of the total width of the document.

h1 {margin: 10px 2% -10px}
top margin will be 10px, left and right margin will be 2% of the total width of the document, bottom margin will be -10px

h1 {margin: 10px 2% -10px auto}
top margin will be 10px, right margin will be 2% of the total width of the document, bottom margin will be -10px, left margin will be set by the browser