JSFiddle - React, Tailwind, and code Playground

HTML

<div style="width:100%;">
    
    <div class="halfColumn">
        some content
        <br/>
        <input />
    </div>
    <div class="halfColumn">
        bla bla
        <br/>
        lorem ipsum
        <div style="border-style:solid; border-width: 1px; border-color: red;">
            <div class="centeredOverlay">Loading...</div>
            <select size=2 style="width:100%; height:50vh">
            </select>
            <button>Click me</button>
            <button>Click me too</button>
            
        </div>
    </div>
    <div style="clear:both"></div>
</div>

CSS

.centeredOverlay {
  position: absolute;
  background-color: rgba(0,0,0,0.3); /*dim the background*/
}

.halfColumn {
    float: left;
    width: 50%;
}

.halfColumn2 {
    float: right;
    width: 50%;
}