TileDesign Template Collection Tiles

Design help Layout & Design
1

I am trying to make a collection list that has different widths for collection items. On the main page of this template, you will see a box with tiles, all with the same height, where on the first line, one has the class 60block and takes 60% of the width of the parent element, and then there is a 40block taking 40%. On the next row, there are three 33block divs, each taking a third of the row. I would like to achieve this as a collection. I have started setting it up on the Portfolio page of the site, but don’t know how I can have different sized blocks for the collection items. The closest thing I could think of to do so far was to have multiple collection list wrappers, the first one limited to three items, 33% width each, and the second one limited to two, with 50% widths, but I can’t think of how to do it for a 60/40 split.

Thank you in advance.

Site Url: http://ashleystetler.webflow.io
Read Only Link: https://preview.webflow.com/preview/ashleystetler?utm_medium=preview_link&utm_source=dashboard&utm_content=ashleystetler&preview=3480a92be21919f4ae24e4b4f260b86e&mode=preview

2

@chaotix at the moment, that’s not possible. You could use grid to achieve a similar look though! Here’s how to get started with grid Grid | Webflow University and this is an article/video about using grid with the collections Turn a collection list into a responsive grid | Webflow University

1 Like
3

Thanks for the reply. I wound up going with multiple collections in flexbox. I may redo it with Grid at sone point.

1 Like
4

Good to know you were able to find a way to make it work for you @chaotix.

1 Like