user3837882 user3837882 - 1 year ago 70
CSS Question

Why is my background image not showing in IE but working fine in every other browser?

IE Version: Latest


#mainbackground {
background-image: url(../images/mainbackground.jpg);
height: 250px;

<div id="mainbackground"></div>

Things I have tried and that have failed:

  1. Having no spaces between declarations.

  2. Adding quotes, single & double ticks.

  3. Changing height or width to 100%.

  4. Checked case sensitivity. Everything is lowercase.

  5. Checked visibility & opacity.

Other information:
Works perfect in Firefox, Chrome & Safari.
Animation switches to another background after this one with the exact CSS, just a different ID name and it works fine.

Let me know if you need anything, thanks!

Answer Source

First try this:

background-image: url('../images/mainbackground.jpg');

If It's not works... then there's something wrong with the jpg files, probably. IE8 is not able to render them. Maybe you are using a JPEG2000 format?

Try loading the pictures in an editor, like GIMP or PhotoFiltre and re-saving them (using save as).

You should try to make image files as small as possible on the site because that largely affects the visitors experience.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download