Forums

jbope

I have made a page with a background florish that looks good in FF, Safari and Opera. It is supposed to be centered just like in those browsers. There are two backgrounds and they are both centered but in IE, they are not.

Is this part of the box model problem I keep hearing and reading about and yet not understanding. If so how do I fix it?

Thanks in advance.
Jeane

The web page is <www.thishope.org/contactold.htm>

apostrophe

I think your problem is coming from this line:

html {
overflow:scroll;
}

Try changing it to overflow: auto and see if that fixes the IE problem. If so just put that in an IE specific stylesheet and the change it back to overflow-y: scroll (y will get rid of the horizontal scrollbar).

jbope

Tried switching to auto. It is different but still not centered. Any other ideas?
<www.thishope.org/contactold.htm>

Thanks
Jeane

apostrophe

You coud try this:

 html {
overflow-x: hidden;
overflow-y: scroll;
}

jbope

Tried that also. No change. Just make no sense to me why they aren't both centered like in FF.

apostrophe

Short answer: because IE is a piece of crap, always has been always will. :x

How about :

body {
text-align: center;
}
#florish-bg-wrap {
text-align: left;
}

jbope

Thanks tried that also with different combinations of the first ideas like auto instead of scroll. Does not help. Ug.

apostrophe

Sorry, I was too tired and went to bed. :)

So let's try a new tack. On the #page-wrap div, instead of margin: 0 auto; how about margin: 0 0 0 97px; The difference between the width of #florish-bg-wrap and #page-wrap is 194px so half of that as a margin must center it. I hope :|

jbope

Don't really see a change.

Just for reference I am looking at this page on a mac with no IE. The testing I am doing is in Netrenderer.com. Could this be part of the problem? Are you looking at it in IE on a PC?

apostrophe

No I'm on a Mac too. Hence all the guesswork :)

I have an old Sony laptop running XP (and Ubuntu) and when you first posted last week I looked at the page on that and noticed a horizontal scrollbar, which is why I was concentrating on the html scroll rule.

What happens if you set the body width to 99% ?

treehouse : what would you like to learn today?

Forums

background alignment issue