IE8 problems using a full screen scale background

[Joejacks]

Hi

I am trying to stretch a background image in the body tag using the code below. It works well in Chrome and Firefox but in IE8 the page is not working, the page will not scroll and is unresponsive

background:url(bg.jpg) no-repeat center center fixed;
-webkit-background-size:cover;
-moz-background-size:cover;-
o-background-size:cover;
background-size:cover;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’bg.jpg’,sizingMethod=’scale’);

The problem seems to be
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’bg.jpg’,sizingMethod=’scale’);

but when I remove this and view in IE8 the background image does not cover the page background, but the site does work again.

Regards
Joe

[Paulie_D]

IE8 does not support `background-size:cover`.

On looking at the Sizing Method

>scale : Stretches or shrinks the image to fill the borders of the object.

It doesn’t specify that it will **distort** the image to fill both vertically and horizontally.

This might help: https://css-tricks.com/perfect-full-page-background-image/

[Joejacks]

So is it recommended to take this out
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’bg.jpg’,sizingMethod=’scale’);

If so what would I replace it with to get a full screen background in IE8

[Paulie_D]

See the link above which has a couple of options

[Joejacks]

Thanks I have now sorted the problem using a blank div and assigning the styles to this

[Author]

Posts