JSFiddle - React, Tailwind, and code Playground

HTML

<div class="float" style="height: 50px;">1</div>
<div class="float">2</div>
<div class="float">3</div>
<div class="float">4</div>
<div class="float" style="height: 150px;">5</div>
<div class="float">6</div>
<div class="float">7</div>
<div class="float">8</div>
<div class="float">9</div>
<div class="float">0</div>
<div class="float">a</div>
<div class="float">b</div>
<div class="float">d</div>
<div class="float">d</div>
<div class="float">e</div>
<div class="float">f</div>
<div class="float">g</div>
<div class="float">h</div>
<div class="float">i</div>
<div class="float">j</div>
<div class="float">k</div>
<div class="float">l</div>
<div class="float">m</div>
<div class="float">n</div>

CSS

.float{
    width: 45%;
    display: inline-block;
    float: left;
    background-color: #000;
    margin: 5px;
    color: #FFF;
    padding: 5px;
}