JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper">
    <div id="red">
    </div>
    <div id="green">
    </div>
</div>

CSS

#wrapper {
    border: 1px solid blue;
    padding:5px;
    width:400px;
    margin:auto;
    position:relative;
    overflow: hidden;
}
#red {
    background:red;
    height:300px;
    width:195px;
    float:left;
}
#green {
    background:green;
    width:195px;
    height:50px;
    position:absolute;
    right:5px;
    top:50%;
    margin-top:-25px;
}