IE Troubleshooting

stdmedia

Hello everyone!
I'm new to vanilla so please bear with me, so here goes. I've just modified the original CSS in vanilla slightly (very slightly and will continue to tinker when I get time), and all appears well except in IE. The head area appears larger than the rest and the entire forum is on the left, instead of being centered.

If anyone could help me it'd be most appreciated.

The site is at: STD Gaming Forum

jos

Hi stdmedia, If you only made very slight changes, it's probably easier for us if you tell us what you changed. :-)

Bergamot

Adding "margin: 0px auto;" to .SiteContainer is not sufficient to center a block in IE (it should be, but it isn't).

Add "text-align:center;" to the body element

(important note: not .Body, #Body, .PageBody, .CommentBody, or anything else)

(other note: you also have to add "text-align:left;" to .SiteContainer to keep the centered text setting from inheriting down the tree)

I'll check for the source of the other problem in a sec.

Bergamot

I think removing the width from .Head fixes the other issue. It shouldn't be necessary, since blocks expand horizontally by default and the parent element has a defined width and padding.

Bergamot

Isn't IE6 great?

stdmedia

Oh that makes perfect sense... Thanks for the reply... Gonna go fix it right now Cheers

Bergamot

Let me know if there are any other problems.

jos

hmm, text-align center is a very uncommon way of handling centering if divs. Instead, position: relative; is used.

Bergamot

That works in IE?

I have no idea where I got that habit; I'll have to check it out.

EDIT: It is almost certain that I picked it up from glish

jos

Let's say that IE5 shouldn't play a role anymore for css development. ;-)

Bergamot

Ahh, I see sir.

timberford

i always use text-align: center; what's the advantage of position: relative; ?