JSFiddle - React, Tailwind, and code Playground

by josevarela24

HTML

<div class="container">
        <div class="one">
            one
        </div>
        <div class="two">
            two
        </div>
        <div class="three">
            three
        </div>
        <div class="four">
            four
        </div>
        <div class="five">
            five
        </div>
        <div class="six">
            six
        </div>
        <div class="seven">
            seven
        </div>
        <div class="eight">
            eight
        </div>
        <div class="nine">
            nine
        </div>
        <div class="ten">
            ten
        </div>
    </div>

CSS

.container {
    background-color: blue;
    display: flex;
}

.one {
    height: 400px;
    width: 30%;
    background-color: red;
}
.two {
    height: 250px;
    width: 35%;
    background-color: white;
}
.three {
    height: 400px;
    width: 35%;
    background-color: lightblue;
}