JSFiddle - React, Tailwind, and code Playground

HTML

<div class="outer1">
    <div id="inner">
    </div>
</div>
<div class="outer2">
    <div id="inner">
    </div>
</div>

CSS

.outer1 {
    width: 40%;
    height: 500px;
    margin-left: 5%;
    float: left;
    background: yellow;
}

.outer2 {
    height: 500px;
    width: 40%;
    margin-right: 5%;
    float: right;
    background: green;
}
    
#inner {
    width: 100%;
    height: 200px;
    background: orange;
}