To get this to work across all browsers we need to do a couple of things.

First of all we need to define the width of our DIV. Say we’re going to make a website that is 800 pixels wide.

The CSS needs to be:

body {
text-align:center;
}

#main { /*// This is your main div that wraps all content//*/
width:800px;
margin:0px auto;
text-align:left;
}

The HTML:

What this does is set the width of the site, and the tells the DIV to have no margin top and bottom, but to have equal margins left and right, thus causing the DIV to display in the centre of the page. The reason we use the body attribute as well is because IE sometimes has issues with understanding the auto margin, but understands the text-align attribute for this purpose far better, all we need to do is re-set the text-align in the #main tag.

And there we have one centre aligned website using DIVs.