IE background issues

[Sentient Fluid]

Hi,

The link below shows up perfectly in Firefox 0.9, however, not so
surprisingly, it didn't work when I tested it in IE 6.0.

What do I need to fix to get it to render properly in IE?

http://saskferrets.com/second.htm

~Senti

 

[Neal]

Hi,

The link below shows up perfectly in Firefox 0.9, however, not so
surprisingly, it didn't work when I tested it in IE 6.0.

What do I need to fix to get it to render properly in IE?

http://saskferrets.com/second.htm

~Senti

html {
background: #fff;
}
body {
background:url(Images/tracksdouble.gif) #D1CDC1 repeat;
}

Perhaps the HTML background setting is interfering, though I don't know
why it should. It would appear that's what's happening in practice. Try
fixing that first. Beyond that, I'm stumped for now.

 

[rf]

Hi,

The link below shows up perfectly in Firefox 0.9, however, not so
surprisingly, it didn't work when I tested it in IE 6.0.

What do I need to fix to get it to render properly in IE?

I think it looks fine in IE

http://saskferrets.com/second.htm

Seriously, for what that page does you have way way too much CSS in there.

The whole thing could be done with three or four rules, no more than 20
properties in total. Not pages and pages of it. You are probably totally
confusing IE, not a difficult thing to do.

Throw *all* of it out and put back only what you actually need to realize
the page layout.

Hint 1: lose the absolute positioning and that overflow: scroll div. This is
worse in some ways than frames.

Hint 2: With Mozilla that div must be scrolled with the scroll bar. The
arrow/PgUp/PgDn keys do NOT work. This alone precludes anybody who uses the
keyboard for navigation from using your site.

The mouse wheel does NOT work. That precludes *me* from using the page. I
would immediately declare the page broken and go back to the google results.

 

[Sentient Fluid]

html {
background: #fff;
}
body {
background:url(Images/tracksdouble.gif) #D1CDC1 repeat;
}

Perhaps the HTML background setting is interfering, though I don't know
why it should. It would appear that's what's happening in practice. Try
fixing that first. Beyond that, I'm stumped for now.

Found out it's the borders in * html #content that are causing the
problem. I'd make them transparent, but it seems IE6 (among others)
doesn't handle that.

 

[Sentient Fluid]

Sentient Fluid wrote:




I think it looks fine in IE




Seriously, for what that page does you have way way too much CSS in there.

The whole thing could be done with three or four rules, no more than 20
properties in total. Not pages and pages of it. You are probably totally
confusing IE, not a difficult thing to do.

Throw *all* of it out and put back only what you actually need to realize
the page layout.

Hint 1: lose the absolute positioning and that overflow: scroll div. This is
worse in some ways than frames.

Hint 2: With Mozilla that div must be scrolled with the scroll bar. The
arrow/PgUp/PgDn keys do NOT work. This alone precludes anybody who uses the
keyboard for navigation from using your site.

The mouse wheel does NOT work. That precludes *me* from using the page. I
would immediately declare the page broken and go back to the google results.

Thanks for the critique. I was already aware of the limitations with
Mozilla and the scrolling, as well as the lack of use of the mouse wheel.

Could you explain in what ways the scrolling div is worse than frames?
It'll help me decide whether or not I need/want to keep it. Out of
curiousity, will the content div (the one that scrolls) still allow
tabbing through the any links that may be in it?

As far as I can see, the absolute positioning is the only way to keep
the menu and the content where they are. I admit to being a novice at
this, though.

As for the "pages and pages" of CSS, how would you suggest I pare it
down and still have it capable of rendering in IE5.01, IE5.5, IE6 (once
I fix the problem with the borders), Opera 7.23, Mozilla and Firefox?

~Senti