JSFiddle - React, Tailwind, and code Playground

HTML

<div class="column-container">

<div class="col item" style="height: 100px;">1 <- More text and thus taller than the other ones</div>
<div class="col item">2</div>
<div class="col item">3</div>
<div class="col item">4</div>
<div class="col item">5</div>

</div>

CSS

.column-container {
        display: flex;
        justify-content: center;
        flex-flow: row wrap;
        height: 100%;
    }

    .item {
        height: fit-content;
        min-width: 150px;
        max-width: 150px;
        margin: 10px;
        border: 1px solid black;
    }