CODEWITHSUNDEEP
htmlcssinternet-explorer
Sunwoo Yang
Sunwoo Yang

Reputation: 1243

I can't get background image to show up on Internet Explorer

body {
    margin:0px;
    padding:0;
    background: #777 url(foodwine.png) center fixed;
    background-repeat:no-repeat;    
    text-align:center;
}

I can't seem to get this background image to show up on IE7 (I'm not sure about other IEs).

I've tried all different kinds of variations and spacings but it just doesn't want to show up in IE.

Any help would be much appreciated!

Edit: I'm using rails to serve the image and it works in firefox/chrome. I tried specifying the directory with '/images/foodwine.png' but now it doesn't show up on any browser.

http://afternoon-samurai-9254.herokuapp.com/ This is the page I'm working on.

Upvotes: 0

Views: 1133

Answers (5)

ggonzalez
ggonzalez

Reputation: 189

It seems that ie7 have a weird behavior (bug?) rendering heavy images (2.3MB in this case), try using jpg image format instead, a png is normally used to support transparency which I dont see it in this case.

Upvotes: 0

Subash
Subash

Reputation: 7256

You need to have strict doctype for fixed positioning to work on IE7.

    <!DOCTYPE htmlPUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Upvotes: 0

ggonzalez
ggonzalez

Reputation: 189

Try this:

body {
    margin:0;
    padding:0;
    background: #777 url(foodwine.png) no-repeat center fixed;
    text-align:center;
}

Upvotes: 1

David Carrus
David Carrus

Reputation: 182

Try to use margin:0, instead of 0px. As Cole said add quotes around the image url. I suppose the image exists 'cause you are pointing out explorer, so i think you tried other browsers.

Upvotes: 0

John Conde
John Conde

Reputation: 219814

I'm guessing that the image is in a directory called images or something similar? If so, calling it from your root web directory is the safest way to make sure it is referenced properly:

background: #777 url('/images/foodwine.png') center fixed;

Upvotes: 0

Related Questions