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%
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%
}
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;}