You are hereBlogs / dave's blog / CSS Fix: Background Image Appears on FireFox but not IE

CSS Fix: Background Image Appears on FireFox but not IE


By dave - Posted on 25 February 2009

Have you ever rewritten some CSS, only to discover that the background image of your page's body element works in FireFox, but not Internet Explorer?

FireFox is just a little bit better at filling in the details for misconstrued CSS rules than IE7. If you're using the background pragma to define all the attributes at once, make sure you define everything, not just the attributes you want to change. For example, do this:

background: #e5e5e5 url(img/body.gif) repeat fixed top left;

...as opposed to this:

background: #e5e5e5 url(img/body.gif);

IE7 isn't able to "fill in" the default values, and will ignore the entire directive.

About the Author

dave's picture

Name
Dave Nugent

Bio

Dave is a freelance Drupal developer working in San Francisco. He runs the San Francisco JavaScript Meetup and GamesJS, an HTML5 gaming group. He's a graduate of CMU Silicon Valley. In his spare time he docents at the Computer History Museum and serves on the board of the Digital Game Museum. Follow Dave on Twitter @drnugent.