JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <div class="grid_1">
        <p>20%</p>
    </div>
    <div class="grid_2">
        <p>60%</p>
    </div>
    <div class="grid_1">
        <p>20%</p>
    </div>
    <div class="clear">&nbsp;</div>
</div>

CSS

.container {
    background-color: #333333;

    width: 100%;
}

.grid_1{
    display: inline;
    float: left;
    width: 20%;
    position: relative;
}

.grid_2{
    display: inline;
    float: left;
    width: 60%;
    position: relative;
}

p {
    border: 1px solid #333333;
    padding: 10px;
    background-color: #FFFFFF;
}

.clear {
    clear: both;
    display: block;
    height: 0;
    overflow: hidden;
    visibility: hidden;
    width: 0;
}