JSFiddle - React, Tailwind, and code Playground

HTML

<div class="parent">
        <div class="center-me">
            Text, images, whatever suits you.<br>
            Multiple lines is totally fine!
        </div>
    </div>

CSS

.parent { 
        /* height can be whatever you want, also auto if you want a child 
           div to be responsible for the sizing */ 
        height: 200px;
        background: red;
    }

    .center-me { 
        border: 2px solid #fff;
        position: relative;
        top: 50%;
        transform: translateY(-50%);
        /* prefixes needed for cross-browser support */
        
    }