JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <div class="item"></div>
    <div class="item"></div>    
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>    
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
</div>

CSS

#container {
    column-count: 3;
}
.item {
    height: 20px;
    margin-bottom: 20px;
    width: 100%;
    background: lightblue;
    
    break-inside: avoid-column;
}
.item:nth-of-type(2){
    break-after:column;
    display:block;
}