CODEWITHSUNDEEP
htmlinternet-explorer-6center
smith
smith

Reputation:

IE6 Centered Content Bug

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?

Upvotes: 0

Views: 502

Answers (4)

Jon Winstanley
Jon Winstanley

Reputation: 23311

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;
}

Upvotes: 1

smith
smith

Reputation:

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

Upvotes: 0

Diego Jancic
Diego Jancic

Reputation: 7450

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.

Upvotes: 0

Justin Niessner
Justin Niessner

Reputation: 245459

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">

Upvotes: 0

Related Questions