JSFiddle - React, Tailwind, and code Playground

HTML

<div class="siao">
    <div class="element">
        I AM A BLOCK OF CENTERED TEXT
    </div>
</div>

CSS

.element {
  text-align:center;
  position: relative;
  top: 50%;
    -webkit-transform: translateY(-50%);
  	-ms-transform: translateY(-50%);
  	transform: translateY(-50%);
}

.siao {
    display: block;
    height: 300px;
    width: 300px;
    border: 1px solid black;    
}