JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <div class="top"></div>
    <div class="middle"></div>
</div>

<div class="right"></div>
    
<div class="bottom"></div>

CSS

.container{
    float:left;
    margin-left:10px;
    background-color: black;
}
.top{
    width:100px;
    height:100px;
    background:green;
}


.middle{
    width:100px;
    height:100px;
    background:darkred;
    margin-top:5px;
}
.right{
    width:100px;
    height:200px;
    background:lightgreen;
    float:left;
    margin-left:10px;
}

.bottom{
    float:left;
    width:100px;
    height:100px;
    background:green;
    margin-left:10px;
}