JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container clearfix">
    <div>1</div>
    <div>2</div>
    <div>3</div>
    <div>4</div>
    <div>5</div>
    <div>6</div>
    <div>7</div>
    <div>8</div>
    <div>9</div>
    <div>10</div>
</div>

CSS

.container{
    background-color: #A9A9A9;
    display: inline-block;
}
.container > div{
    float: left;
    margin: 10px;
    width: 100px;
    height: 100px;
    font: 25px/100px sans-serif;
    text-align: center;
    background-color: #98FB98;
    color: #444;
}
.clearfix:before,
.clearfix:after{
    content: " ";
    display: table;
}
.clearfix:after{
    clear: both;
}
.clearfix{
    *zoom: 1;
}