.grid { display: grid; block-size: 250px; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); grid-template-rows: masonry; align-tracks: end, start, end, space-between; }
<div class="grid"> <div class="item" style="block-size: 2em;"></div> <div class="item" style="block-size: 3em;"></div> <div class="item" style="block-size: 1.6em;"></div> <div class="item" style="block-size: 4em;"></div> <div class="item" style="block-size: 3.2em;"></div> <div class="item" style="block-size: 3em;"></div> <div class="item" style="block-size: 4.5em;"></div> <div class="item" style="block-size: 1em;"></div> <div class="item" style="block-size: 3.5em;"></div> <div class="item" style="block-size: 2.8em;"></div> </div>