Center Align Div In Explorer (6) While Using Quirks Mode

Forum Moderators: not2easy

Message Too Old, No Replies

Center Align Div In Explorer (6) While Using Quirks Mode

ideffect

7:15 am on Dec 19, 2006 (gmt 0)

Hello,

I am having a problem centering the main container div in explorer 6 while in quirks mode. If I switch to loose or strict doctype, the div does center but creates another problem (which might be easier to solve). The layout looks good in Firefox 2. Here is the realvent coding and thank you for your help!

CSS:

body { background-color: #8d5d01; background-image: url(Images/background_repeat.jpg); background-repeat: repeat-x; background-attachment: scroll; text-align: center; width: 788px; height: 100%; margin: 20px auto 0; }
#main_box { width: 789px; height: inherit; float: left; }

HTML:

<head>
<title>TITLE</title>
<link href="css.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="main_box">
<All this stuff that should be centered>
</div>
</body>

I also tried adding <div align="center"> right after the <body> tag.

Fotiman

3:29 pm on Dec 19, 2006 (gmt 0)

You're floating your main box to the left... that's going to pretty difficult to center, wouldn't you think? :)

Try this instead:

body
{
background-color: #8d5d01;
background-image: url(Images/background_repeat.jpg);
background-repeat: repeat-x;
background-attachment: scroll;
text-align: center;
/* width: 788px; */
height: 100%;
margin: 20px auto 0 auto; /* Added auto to both left and right */
}

#main_box
{
width: 789px;
height: inherit;
/* float: left; */
text-align: left;
}

ideffect

6:40 pm on Dec 19, 2006 (gmt 0)

Well I feel like an idot! It works perfectly now.

Thanks for catching that.