JSFiddle - React, Tailwind, and code Playground

by rohitazad

HTML

<div class="box1">
Area 1
</div>

<div class="box2">
    Area 2
</div>

<div class="box3">
Area 3
</div>

<div class="box4">
Area 4
</div>

CSS

html, body {
    width: 100%;
    height: 100%;
}

.box1, .box2, .box3, .box4 {
    float: left;
    width:49%;
    height: 49%;
    border-style: solid;
    border-width:1%;
}

.box3{
    clear:left;
}