Hey!
I wonder if I can create a portfolio grid similar to this one Work - Mo Eid - Digital Designer & Art Director based in Dubai using webflow CMS. I looked for tutorials but didn’t find the one I need. So would appreciate any tutorials or instructions.
Basically, I’d like to know how I can make each portfolio item have different size and position.
Collection lists are generally designed to build uniform layouts, like lists and grids tables.
For a non-uniform layout, you could use multiple collection lists. First list shows item 1 only. Second list shows item 2 only, and so on. Then you style and position each of them where you want.
Thanks for your reply, I saw they used a grid but I was stuck with styling individual cms portfolio item so that they take different number of columns. Just was not sure if I needed to use some code to do it.
Yes you’d use quite few, but it’s the easiest way to position items arbitrarily in the designer. Any other approach involves using custom CSS to override the collection list grid layout at the item level.
That’s actually not difficult though-
If you use Stan’s 12-column grid approach then the CSS is just a starting column, colspan and a top-margin for each item, something like this;