JSFiddle - React, Tailwind, and code Playground

HTML

<hr>
<span class="textvalignmiddle"><span>
    vertically centered text dfgdfhgiugh dgdgdhgdkgh dghdkjghdkjgh dghdfkhgdlkjghdlkhg dhgdljkfhfkjdhgkjdfgh dkghdkjfghkj ghd gjdhdlkjg hdlhdf gh ldkh
</span></span>
<hr>

CSS

.textvalignmiddle {
    line-height: 200px;
}

.textvalignmiddle > span {
    display: inline-block;
    vertical-align: middle;
    line-height: 1em; /*set line height back to normal*/
}