0

I am trying to paint an image as the background for a div element. But not able to figure out on how to control the resolution of the image.

My image resolution is 1400X900 px. I wanted to paint that image so that it wont be trimmed and fits to the screen. How to set the image size so that it will be fitted to screen? I tried using background-size but it is not working in I.E.

below is my div element

<div style="background:url('...');">
    some more elements
</div>
j08691
  • 204,283
  • 31
  • 260
  • 272
dush
  • 211
  • 4
  • 15
  • If `background-size` is not working in IE then we need to know the version number (IE 8 does not support that) and see all the code you are trying to use. Also, I think [this is a duplicate](http://stackoverflow.com/questions/1341358/set-size-on-background-image-with-css). – user1934286 Dec 12 '13 at 20:47

2 Answers2

0

background-size (background-size: contain for instance) is the way to go. However, as you yourself note, this doesn't work in IE 8 and below.

For old IEs you can consider using background-size polyfill, which emulates background-size.

You could write a script that does the same thing but that might be more trouble than it's worth.

Lasse
  • 1,414
  • 11
  • 19
0

Use Css3 option background-size.

For example background-size:100% 100%;