JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
 <div class="item"> <div class="textitem">Text</div> </div>
 <div class="item"> <div class="textitem">MoreText</div> </div>
 <div class="item"> <div class="textitem">Even more text</div> </div>
 <div class="item"> <div class="textitem">Even more text</div> </div>

 <div class="item"> <div class="textitem">Even more text</div> </div>
 <div class="item"> <div class="textitem">Even more text</div> </div>
</div>

CSS

.container {
    background-color:#FFFFFF;
    width:450px;
    height: 300px;
    margin:10px auto;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    outline: 1px solid blue;
}

.container .item {
    outline: 1px solid red;
}

.container .textitem {
    width:100px;
    height:100px;
    display:table-cell;
    vertical-align:middle;
    text-align:center;
    background-color:#CCCCCC;
}