Lawrence Barsanti Lawrence Barsanti - 1 year ago 80
CSS Question

What is the best way to center a webpage's content using css?

I have seen several methods for creating simple fixed width single column layout using CSS. I like the one shown here because there is very little code involved and it works on every browser I have tried.

#container {
margin: 0 auto;
width: xxxpx;
text-align: left;

<div id="container">
...entire layout goes here...

The author mentioned that he received some criticism. I not a web developer so I wanted to ask the community what they thought about this approach. More specifically is there a better/more compatible way to accomplish this?

Answer Source

The "margin: 0 auto" is the best way to do it, you just have to be sure to have the right doctype for it to work. I always use XHTML strict - others will work too. If you don't have a good doctype, the content won't center in IE6

To implement the XHTML strict doctype, put this above your node, as the first line in the page:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "">
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download