css – Website displays badly in IE 8, but works fine in other browsers – Education Career Blog

I’ve been working on this website for a little while and, now that it’s online, I’m frustrated with cross-browser compatibility issues that don’t present themselves when I view the site from my pc.

If you view the site in Google Chrome, you should see it exactly as it’s meant to be seen. In IE 8, I’ve only noticed one thing missing.
Belows the TEAM menu item is an icon with an i in it. This icon should be above an image that run grey to black from right to left. This gradient image doesn’t display in IE 8 despite modifying the IE 8 stylesheet to explicitly put it in there.

Also, for some reason, I can see the submenu that comes out from the INVESTMENTS menu item on my pc, but my dad can’t see it on his. I’ve also added the Menu system’s CSS to the IE 8 stylesheet as well.

as earlier stated, these problems don’t exist on my dev pc… I’m all out of ideas, can anyone suggest anything?

Thanks in advance.


The url to the image in ie.css is wrong.

It should be:

background: url("Images/Splurb2.png");

(note the capital S)


Your doctype

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...

is Transitional. Change it to strict and that should show improvement. I tried your website in FF and IE8 (standard mode (non quirk mode)) and it was working fine. Somehow in a machine where you are not able to see your website properly, IE8 is set to work in quirks mode. By setting your DOCTYPE to strict we can prevent that to certain extent. HTH


You should add the following tag to your head tag in order to tell IE8 to not use compatibility mode when displaying your site:

<meta http-equiv="X-UA-Compatible" content="IE=8" />

Leave a Comment