Setting a divs background image to fit its size?

css, image

Solution

If you'd like to use CSS3, you can do it pretty simply using background-size, like so:

background-size: 100%;

It is supported by all major browsers (including IE9+). If you'd like to get it working in IE8 and before, check out the answers to this question.

Problem

I have a `<div>` with a background Image. The `<div>` size may change over the time. Is it possible setting the Divs Background image to fit the `<div>` size? Lets say I have a div which is `400x400` and an Image which is `1000x1000`, is it possible to shrink the image to `400x400` and therefore fit the `<div>` size?

Original source

Related problems