Background-size 100% not working in IE8 and IE7

后端 未结 2 2000
北海茫月
北海茫月 2021-01-21 07:03

I have an empty div which contain a background image that is bigger than the size of the container. I fix this one by background-image property with the value (100%

相关标签:
2条回答
  • 2021-01-21 07:16

    background-size not supported by ie7 and ie8.

    the alternative way you can use put 'tag' in div tag and add width 100% to it. It is full scalable.

    try this code:

    <div class="container">
        <img src="http://s18.postimage.org/jhbol7zu1/image.png" width="100%" />
    </div>
    

    or

    html:

    <div class="container">
        <img src="http://s18.postimage.org/jhbol7zu1/image.png" />
    </div>
    

    css:

    .container img {
         width:100%
     }
    
    0 讨论(0)
  • 2021-01-21 07:30

    since background-size is CSS3 specific which is not supported to IE you have to do something like this for it to work in IE

    set your html and body to

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

    wrap the image you want fullscreened with a 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 sort of reset to remove the margins and paddings, something like this

    html, body {height:100%; margin:0; padding:0;}
    
    0 讨论(0)
提交回复
热议问题