JSFiddle - React, Tailwind, and code Playground

HTML

<div class="collection">
    <div style="height:50px">1</div>
    <div style="height:80px">2</div>
    <div style="height:60px">3</div>
    <div style="height:40px">4</div>
    <div style="height:80px">5</div>
    <div style="height:50px">6</div>
    <div style="height:60px">7</div>
    <div style="height:40px">8</div>
</div>

CSS

.collection { 
    outline: 1px dotted blue; 
    padding: 5px;
    overflow: hidden;  /* clearfix */
}
.collection > div { 
    margin: 0 15px 15px 0;
    width: calc((100% - 2 * 15px) / 3);
    width: calc(33% - 14px);
    float: left;
}

JavaScript

$(function () {
    
    $('.collection>div').each(function (n) {
        $(this).css('backgroundColor', 'hsla(60, ' + n*10 + '%, 45%, 1)');
    });
    
});