JSFiddle - React, Tailwind, and code Playground

HTML

<div class="maininfo">
    <div class="large">2</div>
    <div class="smallblock">
        <div class="smalltop">3</div>
        <div class="small">4</div>
    </div>
    <div class="smallblock">
        <div class="smalltop">5</div>
        <div class="small">6</div>
    </div>
</div>

CSS

.maininfo {

    width: 600px;

}

.large {
    float: left;
    height: 95px;
    background-color: blue;
    width:auto;
}


.smallblock {
    float: right;
    height: 90px;
    margin: 0 0 0 5px;
    width: 20%;
}

.small {
background-color: red;
height: 50%;
width: 100%;
}
.smalltop {
background-color: red;
height: 50%;
width: 100%;
    margin-bottom:5px;
}