Ask your WordPress questions! Pay money and get answers fast! (more info)

IE8 Background stretch WordPress

Hello, my site will show a perfectly stretched background image on most modern browsers but on IE8 it will show an image in the center of the screen if the image is not big enough.

Below is the css I am using for the body of my site, what can I add to make the background image safely stretch to fill the background on IE8?

Thanks

body {
background: url('http://www.mysite.com/image.jpg') center center no-repeat fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
font: 14px 'Open Sans', 'Helvetica Neue', Helvetica, sans-serif;
color: #5f5f5f;
padding-top: 41px;
line-height: 24px;
}

Answers (2)

2013-10-21

S├ębastien | French WordpressDesigner answers:

<strong>you can use [[LINK href="http://louisremi.github.io/jquery.backgroundSize.js/demo/"]]this great js solution[[/LINK]] or read this posts : [[LINK href="http://css-tricks.com/perfect-full-page-background-image/"]]http://css-tricks.com[[/LINK]] or [[LINK href="http://stackoverflow.com/questions/2991623/how-do-i-make-background-size-work-in-ie"]]http://stackoverflow.com[[/LINK]]</strong>

2013-10-21

Balanean Corneliu answers:

Try this one
body {

background: url('http://www.mysite.com/image.jpg');

-webkit-background-size: cover;

-moz-background-size: cover;

-o-background-size: cover;
background-repeat: no-repeat !important;

background-position: top center !important;

background-size: cover !important;

background-attachment: fixed !important;

font: 14px 'Open Sans', 'Helvetica Neue', Helvetica, sans-serif;

color: #5f5f5f !important;

padding-top: 41px !important;

line-height: 24px !important;

}