JSFiddle - React, Tailwind, and code Playground

HTML

<div class="outer">
    <div class="before"></div
    ><div class="inner">     
        Центрированный<br>блок
    </div>
</div>

CSS

.outer{
    height:200px;
    border:1px solid black;
    text-align:center;
    }
.before {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    }     
.inner {
    display: inline-block;
    vertical-align: middle;
    background:orange;
    }