JSFiddle - React, Tailwind, and code Playground

HTML

<div id="main">
    <div id="sub1">
        <div id="sub11">
            <div><h4>ABC</h4></div>
            <div>123</div>
        </div>
        <div id="sub12">
            <div><h4>DEF</h4></div>
            <div>456</div>
        </div>
    </div>
   <div id="sub2">
        <div id="sub21">
            <div><h4>GHI</h4></div>
            <div>745</div>
        </div>
        <div id="sub22">
            <div><h4>JKL</h4></div>
            <div>987</div>
        </div>
    </div>
        
</div>

CSS

#main {display: block;}
#sub11, #sub12, #sub21, #sub22 {display: inline-block;}