(HELP) (URGENT) Images not resizing for mobile

Background images not resizing properly for responsive design on project images.

For mobile they are aligning only to the top right corner.

Thank you!


Here is my site Read-Only: https://preview.webflow.com/preview/essence-properties?utm_medium=preview_link&utm_source=designer&utm_content=essence-properties&preview=0567bf1228c6724888203aa0f4db39ba&pageId=600894e1d10b250432ddf141&mode=preview[1]
(how to share your site Read-Only link)

https://www.essenceliving.com/our-communities

Hey @Savannah. I took a look at your project. If you click on the background image you can change the positioning here.

Personally for me, I like using “cover” as the setting to get a nice fit (but a personal choice)

Let me know if you have any questions!

1 Like

Thank you @david_hoang

The issue is more related to the size for responsive rather than the positioning. I attached screen shots here. Can you let me know which settings to adjust this for mobile?

@Savannah If I understand correctly, you’re looking for a way to make sure they fit the best on mobile, correct? My recommend is to change “Div Block 43” and change the background image settings to “Cover.” You can create responsive images in CMS if you really want to customize the image sizes of them though I find cover to be pretty effective.

That resolved it! Thanks so much for your help @david_hoang

Awesome! Have fun and best of luck on your project!