JSFiddle - React, Tailwind, and code Playground

by Praveen Kumar Purushothaman

HTML

<div class="equalSpaces">
    <div>
        <p></p>
    </div>
    <div>
        <p></p>
    </div>
    <div>
        <p></p>
    </div>
    <div>
        <p></p>
    </div>
    <div>
        <p></p>
    </div>
</div>
<div class="equalSpaces">
    <div>
        <p></p>
    </div>
    <div>
        <p></p>
    </div>
    <div>
        <p></p>
    </div>
</div>

CSS

.equalSpaces {overflow: hidden;}
.equalSpaces p {padding: 5px; margin: 0; background-color: #000; border: 1px solid #999;}
.equalSpaces div {float: left;}

JavaScript

$(document).ready(function(){
    $(".equalSpaces").each(function(){
        totalDivs = $(this).find("div").length;
        $(this).find("div").width(100/totalDivs + "%");
    });
});