Background image scaling and anchoring

Is it possible to apply an anchor to the background images, and then as a browser window is reduced scale the image down appropriately?

An example of what I mean can be found here: http://www.nspcc.org.uk

When I resize the browser window the hero image appears to stay in a fixed position and just decrease in size.

For my own page here: http://siblingstogether.co.uk/founder/

The background image resizes in such a way that the person who I want to remain at the centre of the image disappears out of vie.

On that page you linked that is an image element, on your page that is a background image. They’re not the same thing and they don’t behave the same in this situation.

Try adding this:


@media screen and (max-width: 1024px) {
    .panel-row-style {
         background-size: cover !important;
    }
}

Really helpful - thank you Vlad.