Streaming live at 10am (PST)

CMS Collection list has broken gap


#1

Collection layout is broken on the second and fourth row. What would cause this to happen?


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


#2

Hello @clevy

Can you share your read-only link?

Piter :webflow_heart:


#3

Hi @PiterDimitrov please find the read-only link below. Thanks!

https://preview.webflow.com/preview/urban-seed-inc?utm_source=urban-seed-inc&preview=3d2ca91de2f3fad10dda1d3ce898a245


#4

Great! The collection list on the blog page?


#5

@PiterDimitrov collection list on “follow your food” page. Thanks!


#6

I can recommend using flex box. Here’s a screen record > https://www.useloom.com/share/a28b2bd308d14316bc378a3c0c10c771

Hope this helps

Piter :webflow_heart:


#7

Hey @clevy,

I was about to show the exact same solution as @PiterDimitrov but I will show you a screenshot instead. The best way to use flexbox with CMS items is to make the CMS collection list a parent flexbox, and the CMS items a ‘flexbox child’. This is the proper way to use flexbox, not using a div block individually.

Best,
Naweed


#8

@PiterDimitrov @nwdsha Thank you so much! Your documentation was very clear.