JSFiddle - React, Tailwind, and code Playground

HTML

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

CSS

.container {
    background-color:#0FFFFF;
    width:900px;
    margin:10px auto;
    display: table;
}
.container .item {
    display:table-cell;
    text-align:center;
    /*    width:160px;
    height:160px;*/
}
.container .itemblock {
    display:block;
    margin: auto;
    width:160px;
    height:160px;
}
.container .textitem {
    width:inherit;
    height:inherit;
    display:table-cell;
    vertical-align:middle;
    text-align:center;
    background-color:#CCCCCC;
}