.grid { display: grid; gap: 10px; grid-template-columns: masonry; grid-template-rows: repeat(3, 100px); }
<div class="grid"> <div class="item" style="inline-size: 2em;"></div> <div class="item" style="inline-size: 3em;"></div> <div class="item" style="inline-size: 1.6em;"></div> <div class="item" style="inline-size: 4em;"></div> <div class="item" style="inline-size: 2.2em;"></div> <div class="item" style="inline-size: 3em;"></div> <div class="item" style="inline-size: 4.5em;"></div> <div class="item" style="inline-size: 1em;"></div> <div class="item" style="inline-size: 3.5em;"></div> <div class="item" style="inline-size: 2.8em;"></div> </div>