JSFiddle - React, Tailwind, and code Playground

HTML

<div class="parent">
 <div class="child-a">abc</div>
 <div class="child-b">def</div>
 <div class="child-c">ghi</div>
 <div class="child-d">jkl</div>
 <div class="child-e">mno</div>
 <div class="child-f">pqr</div>
 <div class="child-g">stu</div>
</div>

CSS

.parent div { float: left; }
.parent div:nth-child(3n+1) { clear: left; }