In this small guide I will show how you can horizontally center a box in the browser window. I’ve used as little markup and CSS as I think is possible.

The XHTML

<div class="box-to-center">
<!-- website content goes here -->
</div>

The CSS

div.box-to-center{
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
width: 950px;
}

You can of course make this shorthand like this:
div.box-to-center{
margin: 0 auto;
width: 950px;
}

Notes

It is important to remember that you must set margin-right: auto, margin-left: auto; and a fixed width on the <div> that the entire website is surrounded in.

/Simon Kjellberg