JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
  <div id="text-container">
    I'm vertically/horizontally centered!
  </div>
</div>

CSS

html, body, .container {
    height: 100%;
}
.container {
    display: -webkit-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    justify-content: center;
}

#text-container {
  width: 400px;
  height:400px;
  background-color: red;
}