Forum Moderators: not2easy
<TABLE BGCOLOR="#006600" onmouseover="this.style.backgroundColor='red'" onmouseout="this.style.backgroundColor='#060'">
<TR>
<TD>
<P><IMG SRC="image.gif"></P>
</TD>
</TR>
</TABLE>
The problem is, if I load that page in IE6, the table is dark. If I mouseover then it lights up fine and if I mouseout then the proper color appears. It's just on the initial load that it doesn't work.
Now, here's the weirder part: if I don't mouseover, and leave the image all dark, and then click the Reload button in the browser, it appears correctly! That's so weird -- I've never seen a page that doesn't look right on the first load but looks just fine on a RE-load.
Here's a test page with nothing on it but the example:
<snip>(Ooops sorry no URLS's please see TOS [webmasterworld.com])
I found I could fix this by putting in a cludgy DHTML cross-browser JavaScript to set the background color, but my whole point in using CSS was to *avoid* JavaScript.
By the way, I don't have this problem on the Mac with either IE or Safari.
So who's the genius who can figure this one out? Thanks!
[edited by: SuzyUK at 8:57 am (utc) on May 8, 2004]
[edit reason] URL snipped [/edit]
1. Type in the url directly >> MAY OR MAY NOT DISPLAY CORRECTLY
2. Follow a link to the page >> MAY OR MAY NOT DISPLAY CORRECTLY
3. Click the Reload button >> ALWAYS APPEARS CORRECTLY
4. Click inside the address by and hit Return >> ALWAYS APPEARS WRONG
Can anyone replicate this? I'm surprised if nobody's run into this before. I'm not allowed to post a url here so here's all the code:
<HTML><BODY><CENTER>
<TABLE BGCOLOR=#006600 onmouseover="this.style.backgroundColor='red'"
onmouseout="this.style.backgroundColor='#060'">
<TR><TD><P><IMG SRC="image.gif"></P>
</TD></TR></TABLE>
</BODY></HTML>
Windows XP Pro - all current updates
IE 6.0
Netscape 7.01
Opera - Version7.23, Build 3227
Firefox 0.8
Mozilla 5.0
I tried by link, by typing and refresh. Works perfect. Sorry I don't have any testing setup for older stuff here at home...
Ooops, also tried clicking inside the address by and hitting return.
Sorry if I'm no help. =/
Green #006600
Red #FF0000
You never know...
Have you tried validating your document at the W3C?
Depending on your doctype your code may not validate and may not even display the image. However, in all instances the background displayed as expected.
I guess since no one else can replicate it I'll just hope that only a very small minority of users will experience the problem. And maybe if they do, they'll wonder why the image looks screwy and they'll point to it, which will fix the problem. :)
I did try changing all the color references to the full six-digits, and putting them in quotes, but that didn't help. I'm not using any Doctype.
Thanks again for everyone's help on this. -MBJ-
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/REC-html40/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
"http://www.w3.org/TR/REC-html40/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
