JSFiddle - React, Tailwind, and code Playground

HTML

<div id="parent">
    <div id="child">Both vertically and horizontally centered</div>
</div>

CSS

#parent {
    background-color:#dedede;
    width:500px;
    height:500px;
    display:table;
    text-align:center;
}

#child {
    display:table-cell;
    vertical-align:middle;
}