JSFiddle - React, Tailwind, and code Playground
HTML
<div class="outer">
<div class="inner"> </div>
<div class="inner"> </div>
<div class="inner"> </div>
<div class="inner"> </div>
<div class="inner"> </div>
<div class="inner"> </div>
<div class="inner"> </div>
<div class="inner"> </div>
<div class="inner"> </div>
<div class="inner"> </div>
<div class="inner"> </div>
</div>
CSS
.outer {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: center;
}
.inner {
display: inline-block;
background: #111;
width: 200px;
height: 100px;
margin: 10px;
}