Center DIV using CSS

A simple method for centering divs that I usually use is:

The CSS

#content {
   width: 800px;
   margin: 0 auto;
}

The HTML

something here

What this does is creates a div 800 pixels wide then sets the top and bottom to 0 pixels then sets the left and right margins to be auto. This makes the browser give the div equal spacing on either side.

This should work in all major browsers including IE7, IE8, Firefox, Chrome and Safari.

 

Leave a Reply