JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <div class="leftbox">
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
    </div>
    <div class="rightbox">
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>    
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div> 
    </div>
</div>

CSS

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

.container {
    overflow:hidden;
    width: 600px;
    background: red;
}

.leftbox {
    float: left;
    width: 450px;
}
.leftbox .item {
    width: 80px;
    height: 80px;
    float: left;
    background: green;
    margin: 5px;
}
.rightbox {
    float:right;
    width:150px;
}
.rightbox .item {
    width: 140px;
    height:20px;
    margin: 5px;
    background: blue;
}