JSFiddle - React, Tailwind, and code Playground

by Travis Harris

HTML

<div id="wrapper">
    <div class="tenth">
        1
    </div>
    <div class="tenth">
        2
    </div>
    <div class="tenth">
        3
    </div>
    <div class="tenth">
        4
    </div>
    <div class="tenth">
        5
    </div>
    <div class="tenth">
        6
    </div>
    <div class="tenth">
        7
    </div>
    <div class="tenth">
        8
    </div>
    <div class="tenth">
        9
    </div>
    <div class="tenth">
        10
    </div>
    <div class="tenth">
        11
    </div>
    <div class="tenth">
        12
    </div>
    <div class="tenth">
        13
    </div>
    <div class="tenth">
        14
    </div>
    <div class="tenth">
        15
    </div>
    <div class="tenth">
        16
    </div>
    <div class="tenth">
        17
    </div>
    <div class="tenth">
        18
    </div>
    <div class="tenth">
        19
    </div>
    <div class="tenth">
        20
    </div>
</div>

CSS

#wrapper{
    font-size:0;
}
.tenth {
    font-size:1rem;
    height: 0;
    width: 10%;
    padding-bottom: 10%;
    box-sizing:border-box;
    display:inline-block;
    border:1px solid black;
    margin:0;
}