Here is a simple bit of CSS that will center your website in most common browsers (IE6 & IE7, FireFox etc.).

Firstly, add these two classes to your style sheet.

.outer {
width:800px;
margin:auto;
display:table;
}

.inner {
width:auto;
margin:0px;
display: table;
}

The width in the “outer” class is the width of the site. You can edit this to how wide you want your site to be, but anything else leave untouched (unless you want to experiment of course!)

Now all we do is add two DIVS to the page, one with the class of “outer”, and one with the class of “inner”. Here is what it’ll look like:

<div class="outer">
<div class="inner">

</div>
</div>

That’s it! You will now have a centered website without using those horrid “center” tags!