views:

216

answers:

4

I have some centered content within a div. It shows up fine in Firefox/Chrome. In IE6 the content expands beyond the div to the entire browser window. Any idea what could be causing this?

A: 

Make sure you have the doctype definition at the top of your page. Otherwise, IE6 will open the page in quirks mode which can screw all kinds of stuff up...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
Justin Niessner
A: 

The <center> tag is deprecated. You should do something like this:

<div style="text-align:center; margin: 0 auto; width: 400px;">
</div>

That way you will have centered content.

Diego Jancic
A: 

I have defined the doctype and I am centering the content with CSS.

Please provide you updates as edits to your question, don't answer your own question unless its truly and answer. This is not a thread style forum.
bendewey
+1  A: 

IE6 Workaround

The thing to do is to have text-align: center on a parent div e.g. body, so that your content div is centered in IE6.

Then use margin: auto on the content block to make sure the div is centered in better browsers.

CSS

body {
    text-align: center;
}

#content {
    width: 500px;
    margin-left:auto;
    margin-right:auto;
}
Jon Winstanley