Can anyone help with my project grid?

I’m having trouble figuring out how to change the project page light box grid layout to my desire composition. Can you help me? Took me hours for turotirals but still can’t figure it out. Very appreciated!

Reference image below on the gird I want:

Here is my project link:

If that layout is consistent across all Works pages, you can either;


  • One for item 1
  • One for items 2 and 3 ( two cols )
  • One for item 4
  • One for items 5+ ( two cols )

More collection lists, no custom code, and easier to design responsively.



  • Look into the nth-item pseudoselector, and how to use it. You can tell it that the items in pos 1 and 4 should span 2 cols
  • You’ll probably need to use CSS media queries to change this responsively, so that your images layout properly on mobiles ( vertical stack, perhaps? )

Hi, Thank you so much for the response. This is a template I purchased and I’m a bit confused on the structure and how to change the grid for the project page. I think I will go with the first option you provided SPLIT COLLECTION LISTS. But I still don’t understand how to apply it to my design. Can you help? maybe with some screenshots?

Loom | Free Screen & Video Recording Software | Loom

OMG YOU SAVED MY LIFE!!! Thank you so much this is super helpful and thank you for your time!

1 Like

I got the logic but I can’t find the “limit item” in the setting. Can you help? Thank you

Screenshot 2024-02-27 at 10.17.11 PM

Try clicking the element above in your nav, you’re on the item.
If you haven’t yet, you’d get a lot out of the Webflow U courses on the CMS and collection lists, tons of great videos will help you find these bits.

Or there are some good mentors you can hire in this forum. Drop me a message if you need one :wink: I lean towards the more technical solutions though, so depends on what you want to learn.