How can I make my gallery responsive?

Hi!

Here is my read only site: Webflow - Ethan's Amazing Site

Sorry, total noob here. I’m trying to make my gallery responsive.

Let’s say I have a gallery of images that are all 400x500px. I want them to scale down and maintain their ratio within the page. For some reason when I scale my page up and down it changes their ratio. Currently i’m using the

bg image gallery method.

THANKS!


You can look at using the “aspect ratio” in the style panel to make everything stay in it’s correct ratio. Otherwise you can also look at setting the height of blocks to be in “VW” (view width) which means the height will scale with the screen. (Be careful on extra large screens as things could get huge! You’ll need to set a max-height as well)

Hopefully those might help. I would also look at mobile, maybe stacking the images vertically to ensure that they don’t end up tiny on anyones screen.

Thanks Tom!

I messed around with those methods but still couldn’t figure it out. Any ideas?

https://preview.webflow.com/preview/ethans-amazing-site-c41ca9?utm_medium=preview_link&utm_source=designer&utm_content=ethans-amazing-site-c41ca9&preview=447711a31fec0319644b324cbeacea7b&workflow=preview

Thanks