I’m using a series of collection items to display a series of thumbs filling the width of a site. Using flex grow I display 3 wide and it breaks down to mobile really elegantly. The only problem is that I have 8 items in my grid and the last row has 2 items that fill the width completely, breaking the grid.
I’ve looked for solutions online and it seems a popular one is inserting a 0 height item on the last row to fill the gap, thus pushing the other items to the left.
How would I do this using a collection item? Here is what I mean: on the left is the current layout, the right is the desired layout.
Imgur: The magic of the Internet
Thanks!