Making images responsive?

Hello All,

I’m having some issues with making the images on my site responsive/am just generally unsure in this area so any guidance would be helpful.

If you resize my homepage to a tablet form, the ‘services’ images get squished in too small - how can I make it so that these are responsive and get smaller as the screen changes size, as I see on other websites?

Thanks!

https://preview.webflow.com/preview/wdjc?preview=19e0e44e0db755bb4a6dc40808d9dd7a
http://wdjc.webflow.io/

Hi @Conor_Maurice

Try 100% on both ‘width’ and ‘height’ for the image (in desktop mode - this will cascade down to the others) - that produces more natural looking dimensions across each breakpoint.

When it says 100% it means 100% of the parent div it is inside of (in this case a column)

Hope that helps…more details here:

Alternative approaches you can also use to handle responsiveness, include Flexbox, more details here:

1 Like

Cool that’s worked, thanks for the help!