Streaming live at 10am (PST)

Formatting image gallery with Flex

Hi there,

My photo gallery formatting is terrible - they are all skinny… I have created a grid, but I can’t get my collection list in there, how do I get this looking good?

https://preview.webflow.com/preview/dmc-projects?utm_medium=preview_link&utm_source=designer&utm_content=dmc-projects&preview=324f3261c6ca42ea55255b93dab3b037&pageId=5f743ac3e93918ec809e7694&itemId=614aed3e84d1fa1f20863434&workflow=preview


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

hi @rosespotdigital there are two ways how to

Flex solution (as you have it set to flex already)

  1. collection-list-3 |=> flex wrap
  2. sizing base 25% will set 4 images in row 33.333% 3 images etc

Result

CSS Grid solution

  1. collection-list-3 |=> Grid
  2. add columns as you need
  3. collection-item |=> width: 100%
  4. collection-item |=> in setting (cogwheel) set layout full width

Result

Hope that this basic setting will give you good starting point.

Awesome thank you, so much better!

hi @rosespotdigital if you do not have further questions feel free to close your request as solved. :wink:

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.