JSFiddle - React, Tailwind, and code Playground

HTML

<div class="c1">C1</div>        
    <div class="c2">C2</div>        
    <div class="c4">C4</div>
    <div class="c3"></div>

CSS

.c1 {
            width: 500px;
            height: 100px;          
            background-color: lightblue;
            display: inline-block;
            position: absolute;
            left:0px;
            top:50px;
            opacity:0.8;
        }
        .c2 {
            width: 100px;
            height: 100px;          
            background-color: lightblue;
            display: inline-block;
            position: absolute;
            right:0px;
        }
        .c3 {
            width: 100px;
            height: 300px;          
            background-color: lightcoral;
            display: inline-block;
            position: relative;
            
        }
        .c4 {
            width: 200px;
            height: 200px;          
            background-color: lawngreen;
            display: inline-block;            
        }