Compatibility with IE, please help!
Hi everyone!
I'm having some huge problems with the new design of my site, http://www.bubblegumdancer.com/ While the site looks fine in Firefox, Safari, and Opera, for some reasons the graphics go black and white, and look inverted in Internet Explorer.
I've read online that it's because IE doesn't support transparent PNGs, so I replaced all of the PNGs with GIFs or JPGs, thinking that the problem will be fixed. I uploaded a test page with no PNGs here: http://www.bubblegumdancer.com/artists/test.htm
However, it still shows up black and white in IE. Here is a screen shot of the problem: http://www.flashflashrevolution.com/images/uploads/Pika-Vix1221169333B.JPG
Is there a way to fix this? My Web site is supposed to be very colourful as it is about bubblegum music... this black and white/inverted problem is really grose looking!
I look forward to your replies.
Thank you,
Mitch
pr0gr4mm3r posted this at 04:46 — 16th September 2008.
He has: 1,502 posts
Joined: Sep 2006
Images going greyscale is not something I have heard of in IE. What is that box at the top right that says "Everything grey & black..."? Did you put that there when you noticed the problem?
demonhale posted this at 07:29 — 16th September 2008.
He has: 3,278 posts
Joined: May 2005
On your style CSS, you used an IE specific css command filter, and used the x-ray filter which does this effect on your page.
Go to:
body {background-image: url(Images/flowerdrop.jpg);
background-position:left top;
background-repeat:no-repeat;
margin-left: 0px;
margin-top: 0px;
background-attachment: scroll;
cursor: hand;
filter: Xray;
}
and remove
filter: Xray;
that's it...
howabsurd posted this at 07:43 — 16th September 2008.
They have: 10 posts
Joined: Dec 2007
@pr0gr4mm3r: Thank you for your reply! Yes, I added that Grey and Black notice when I discovered the problem. It doesn't do anything but recommends users download Firefox if they are experiencing the problem.
howabsurd posted this at 07:45 — 16th September 2008.
They have: 10 posts
Joined: Dec 2007
demonhale, thank you! I have updated the CSS file and will check to see if this fixed it now.
howabsurd posted this at 08:57 — 16th September 2008.
They have: 10 posts
Joined: Dec 2007
I updated the CSS file and reuploaded, but when I accessed the site from my auties Internet Explorer, nothing is changed. I opened the CSS file (styles.css) on her computer and it downloaded and opened in Notepad. For some reason, " filter: Xray;" is still there, even though I deleted it and reuploaded. :S
I tried refreshing the page numerous times but it doesn't work. This is so confusing lol. Any suggestions? I really appreciate your help so far.
Megan posted this at 13:25 — 16th September 2008.
She has: 11,421 posts
Joined: Jun 1999
It looks fine to me now in IE 6 (IEs4Linux). Could be that you just need to clear the cache.
howabsurd posted this at 21:08 — 16th September 2008.
They have: 10 posts
Joined: Dec 2007
Megan, OMG you have so many posts! @.@ Lol
I tried clearing the cache, but it still looks the same as it does in the screen shot I posted above. Maybe I'm just being dumb. I use Mac Computers so don't know much about Windows... The browser I am using to test the site is Internet Explorer 7.
webwiz posted this at 23:36 — 16th September 2008.
He has: 629 posts
Joined: May 2007
Nothing to do with Windows. That pesky filter is still there.
Better try uploading the CSS file again.
demonhale posted this at 04:30 — 17th September 2008.
He has: 3,278 posts
Joined: May 2005
rename style.css to style2.css on your html index and upload the edited css file without the filter and name it style2.css , refresh cache (Ctrl+F5 for IE) and load page, that should fix it...
howabsurd posted this at 09:53 — 17th September 2008.
They have: 10 posts
Joined: Dec 2007
Thank you everyone!! ;D I think it's working now! Thank you all for your help!
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.