The site I’m building https://footprintentertainment.webflow.io is very image based. I have added these images as backgrounds, (cover) to the sections. However, when the browser window is moved around the image moves and gets cut off in places (grabs attached). Using contain instead of cover means the images aren’t full screen. The images can’t be part of another image - it has to just be the single image which is fullscreen. Please can you let me know how I can add full screen images that will not react in that way so tops of heads don’t get cut off etc.?
If I set the min-height for the section hero in pixels it does mean the image won’t be cut off but the full image won’t necessarily fill the screen. Ie. less of it will be seen on smaller screens. It would also be possible to scroll the page which I’d like to avoid. If I set the min-height using 100vh it just stays as it is unfortunately.
