Geek Answers Handbook

IE background size not working

I am trying to do background stretching of the whole body (only width). This only works in Chrome, Opera and Firefox. How can I do this work on IE? O_o

background-size:100%;
-moz-background-size: auto 100%;
-o-background-size: auto 100%;
+5
source share
3 answers

since the background size is special CSS3, you will need to use something like this to make it work in IE

install html and body

html {overflow-y:hidden}
body {overflow-y:auto}

wrap the image you want fullscreen with div # page-background

#page-background {position:absolute; z-index:-1}

then put this in your html file

<div id="page-background">
  <img src="/path/to/your/image" width="100%" height="100%">
</div>

** you will have to use some kind of reset to remove the fields and pads, something like this

html, body {height:100%; margin:0; padding:0;}
+3
source

jquery.backgroundSize.js: jQuery 1.5K, IE8 "" "", demo.

+4

background-size is not supported in IE for versions under 9 . A cross-browser solution is to use a jquery plugin like fullscreenr .

0
source

More articles:


All Articles