JSFiddle - React, Tailwind, and code Playground
HTML
<section>
<div></div>
<div></div>
<div></div>
<div></div>
</section>CSS
section { outline: 1px dotted red; display:-webkit-flex; -webkit-flex-flow: row wrap; width: 200px; padding:4px; }
section:hover { width: 300px; }
div { -webkit-flex: 1; width:48%;margin: 10px1 1%; outline: 1px solid gray; height:25px; }