On Firefox the rows get filled first, which is what I’m expecting.
However, on Chrome the columns are filled and then I get a half empty page when there isn’t enough content to fill.
How can I change this behavior on Chrome while still using flex ?
Try setting the .item elements be display: block instead of inline-block and add -webkit-column-break-inside: avoid; to the .items. as well.
1 Like