JSFiddle - React, Tailwind, and code Playground

HTML

<div class="div"></div>
<div class="div"></div>
<div class="div"></div>
</br>
<div class="div2"></div>
<div class="div2"></div>
<div class="div2"></div>
</br></br></br></br>
<div class="div3"></div>
<div class="div3"></div>
<div class="div3"></div>
</br></br>
<div class="div4"></div>
<div class="div4"></div>
<div class="div4"></div>

CSS

.div {
    width: 50px;
    height: 50px;
    background: green;
    margin: 5px;
}
.div2 {
    width: 50px;
    height: 50px;
    background: brown;
    float: left;
    margin: 5px;
}
.div3 {
    width: 50px;
    height: 50px;
    background: purple;
    display: inline-block;
    margin: 5px;
}
.div4 {
    width: 50px;
    height: 50px;
    background: gold;
    display: table-cell;
    border: 5px solid white;
}