Page centered in Internet Explorer 5¹, but not the other browsers³

How to center a page, example 2

To center a block level element in Internet Explorer 5, the parent element needs to be given text-align:center.

Note that IE 5¹ is not following the specs, as text-align:center should only apply to the inline content of blocks, not block-level elements themselves.

This would however, also center all text within the centered element, so that element needs text-align:left, to counter that.

On this page, this looks like this:

body{
	text-align:center;
}
#container{
	width:500px;
	text-align:left;
}

If you are viewing this page with any browser but IE 5³, you'll see it stuck to the left of your window, while in IE 5, it's centered, and it stays centered when you make your window wider or narrower.

What we want, however, is a centered page in ALL² browsers, both IE 5, and the rest.

This is accomplished by combining the two methods, as shown in the next example.

next: ex.3: a centered page!

• back to "centering your page in all browsers"
• ex.1: a centered page in all browsers but IE 5

---

1) Internet Explorer 5 for Windows, not Macintosh.
2) all current browsers, not NN 4 or IE 3. IE 4 acts like IE 5 in this case.
3) Update 2 Februari 2006: IE7 (beta 2) erroneously follows both methods, hence all 3 examples are centered in IE7.