Getting rid of whitespace in collection item wrapping


My dynamic collection items all justify to the top in a new row and there seems to be a lot of whitespace between them (larger than than the collection item borders) that I can’t get rid of. As my image heights vary, setting a set pixel height on the item or div will not work so wondering if there is any way to get them to stack without leaving whitespace between the items.

Many thanks if anyone can help.


Here is my site Read-Only:

Here? The inner item div has margin:10px.

Edit: ok ok, you maybe want to make a masonry grid? See image below

exactly, masonry grid stacking