Irregular Grid with CMS collection

Hello. I need help creating an irregular grid that uses collection list. I want to achieve grid layout visible on the screenshot, which is filled with 2 different image sizes (horizontal and vertical). Ive got no clue how to achieve that. I thought it should be possible to make the images fill the whole height of the grids row while maintaining their aspect ratio, but I cant make it work. Id really appreciate your help!

heres my share link:

What you’re creating here isn’t a grid per-se, but you can handle that extra width by creating a narrower center column, and then using colspan to make your landscape images span that center column as well.

Here’s one way to do that, and how to target your landscape items using custom CSS.

1 Like

Wow, I didn’t expect to receive such a detailed response. I am so grateful for the effort you put into that. Thank you so much! You made it really easy to understand and I would probably never solve it if not for your help, especially the part with custom code. I will update you once I implement all the changes if its ok. Thank you again and have a great day!