How to prevent background images from resizing when in desktop view

Edward_Powell · June 14, 2020, 10:00am

Hi everyone,

I have two background images that are growing too much on full desktop view (i.e. part of the subject’s body gets cut off to make it fit) and I don’t know how to keep them responsive on mobile but also have them not be too large on desktop.

I would love to have something like what I’ve found on the bottom of this website:

The image stays mostly the same size, and then adjusts its position accordingly as the viewport gets smaller, meaning the face of the subject is always in view.

Any help would be greatly appreciated!

Here is my site Read-Only: https://preview.webflow.com/preview/edwards-blank-site-143218?utm_medium=preview_link&utm_source=designer&utm_content=edwards-blank-site-143218&preview=7ea4f60bcabe539ebd89bdce358a19d3&mode=preview

Jonathan_Holden · June 15, 2020, 5:46pm

you need to use the position controls in the background image

Note that Anne-Sopie’s image has LOTS of white space, and even on mobile view it looks ok. The text has been “adjusted” too, I imagine, so that it’s not lost over the face.