JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <div class="box1">Box 1    
        <div class="box2">Box 2</div> 

           </div>
     
    <div style="clear:both;"></div>
</div>

CSS

.container { 
 height:auto;
 width: 500px;
 background: yellow;
}

.box1 { 
 position:relative;
 top:0;
 right:0;
 width:200px;  
 background:red;
 height:500px;
}

.box2 {
    float: left;  
    left:0;
    width:200px;
    background: green;
    height: 100px;
}