Dynamic content grid layout help

https://preview.webflow.com/preview/undergrad-2?utm_medium=preview_link&utm_source=designer&utm_content=undergrad-2&preview=54256d274027dfe530afe21a8997d28f&workflow=preview

HELP !!!

I’m very new to webflow and need help on quite a few matters

1st, On the Main page the grid layout isn’t translating very well when downsizing to different templates ( iPhone ect …) Im not sure how to solve this

In addition to this, my dynamic content int working very well in the grid layout and i’m not sure why? its not scaling well and the image inside the collection list is being squeezed so you only see a proportion of the image.

I would really appreciate any help and advice!!


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hey @patrick2,

I’ve recorded a quick demo to show you how to fix this grid up: Screen Recording 2022-05-06...

Hope this helps!

Thank you so much !!! cant tell you how much you’ve helped !! life saver

Hi! This seems like a really cool project! I think Milan pretty much covered how to do this, but I recently learned about something that might make it easier to design for responsiveness. When you set up the grid sizing, there is a tab that says Min/Max. This basically lets you set a minimum size for the grid sections. Then, you can click on “auto fit,” which allows Webflow to automatically rearrange the grid for mobile views. I used it in a project where I had smaller boxes (about 200 px). On the desktop view, I had a grid with four columns, and then it moved down to three automatically on tablet view, and one on mobile. I like this feature because it makes sure that the elements in your grid don’t get any smaller than you want them to be. I hope this helps!

1 Like