center a DIV in the center of the browser window

liunx

Guest
Hi all

I'm using this to center a DIV in the center of the browser window:


#mainframe {
position:relative;
margin: 20px auto 0px auto;
text-align:center;
overflow: visible;
width:765px;
height: 524px;
visibility: visible;
}


But it's still to the LEFT.

Can anyone see what I'm doing wrong.

This works on my other site.

ChrisIt will work if you use a valid DTD (<!-- m --><a class="postlink" href="http://www.w3.org/QA/2002/04/valid-dtd-list.html">http://www.w3.org/QA/2002/04/valid-dtd-list.html</a><!-- m -->)You may need to set the parent element (I imagine that would be your body) as text-align:center. What browser are you using? I think what you have there should work in Firefox but not IE because... well, I'm sure you know why.Originally posted by BonRouge
You may need to set the parent element (I imagine that would be your body) as text-align:center.

That property (text-align) only applies to inline-elements, so the DIV would not be affected. Because there is a width present and because the left and right margins are both set as "auto," the DIV should be positioned in the center, horizontally.I stand corrected.Unless you are using IE 5.x, Fang told you why it didn't work.cheers fang...that was it!!!

:D :D :D :D :D
ChrisOriginally posted by Jona
That property (text-align) only applies to inline-elements, so the DIV would not be affected. Because there is a width present and because the left and right margins are both set as "auto," the DIV should be positioned in the center, horizontally.

Looking at this again (and after checking) - are you sure about this?

I actually think I was right in what I said there.

EDIT: AAAGGGHHH! I take it back. I think I had an invalid DTD too. I needed it for that. Such a fool!Originally posted by BonRouge
Looking at this again (and after checking) - are you sure about this?

I actually think I was right in what I said there.

EDIT: AAAGGGHHH! I take it back. I think I had an invalid DTD too. I needed it for that. Such a fool!

Don't consider any statement as true unless the standard - the W3C - says it is; though browsers have done an excellent job at translating the words of the W3C, they are apt to bugs and faultiness. Therefore, it's best to look-up each term at W3.org to make sure you're correct in what you say.

Originally located at the W3C CSS2 Specification (<!-- m --><a class="postlink" href="http://www.w3.org/TR/CSS2/text.html#propdef-text-align">http://www.w3.org/TR/CSS2/text.html#propdef-text-align</a><!-- m -->)
This property describes how inline content of a block is aligned.

See also: <http://www.w3.org/TR/CSS2/visudet.html#Computing_widths_and_margins>.
 
Back
Top