How to properly scale img?

Question

css

.main {
width:100%;
height:100%;
background-image: url(img/bg.jpg); }
main div stretched to the full width of the monitor, when resizing, the picture is static, is it possible to make it so that when the size is reduced, the picture shifts, that is, so that the visible area is always the center of the picture

Answer 1

Something like this?
jsfiddle.net/35h6a86r

Answer 2

background-size: cover;