JSFiddle - React, Tailwind, and code Playground

HTML

<div class="c">
    <div class="r">1</div>
    <div class="r">2</div>
    <div class="r">3</div>
</div>
<div class="c">
    <div class="r">4</div>
    <div class="r">5</div>
    <div class="r">6</div>
</div>
<div style="clear: left;"></div>
<div class="c">
    <div class="r">7</div>
    <div class="r">8</div>
    <div class="r">9</div>
    <div class="r">10</div>
    <div class="r">11</div>
</div>
<div class="c" style="overflow: hidden;">
    <div class="r">12</div>
    <div class="r">13</div>
    <div class="r">14</div>
    <div class="r">15</div>
    <div class="r">16</div>
</div>

CSS

div.c {
    border:1px solid blue;
    width: 100%;
}
div.s {
    clear: left;
}
div.r {
    float: left;
    border: 1px solid red;
    margin: 5px;
    width: 50px;
    height: 50px;
}