Question

Possible Duplicate:
CSS Centering a div in different Screens

I presume the answer to this question is really simple but i am stumped.

I am trying to get a website positioned in the center of the screen like the Guardian website – http://www.guardian.co.uk/. I assumed i was right to use a left and right border, however this has made positioning the footer difficult.

Having looked at the guardian website and using the firefox inspect element capability it appears they are using no divs on the left and right of the screen whatsoever. In fact there container appears to just be in the middle of the screen.

So i suppose my question is. How do you position a container like so?

Answer 1

.container {
    /* remember to set a width */
    margin-right: auto;
    margin-left: auto;
}

Here’s the fiddle: http://jsfiddle.net/d9yBs/

---

You can also combine to 2 margin properties, and use the shorthand:

margin: 0 auto;

This’ll set the top & bottom margin to 0, and the left & right to auto.