JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box">
  <div class="item">
    centered<br/>multiline<br/>contents
  </div>
  </div>

CSS

/* vertical centering */
.box { height: 200px; line-height: 200px; font-size: 20px; }
.item { line-height: 20px; display: inline-block; vertical-align: middle; margin-top: -3px; /* baseline is not at the center of the letters */}

/* horizontal centering and decoration */
.box { width: 400px; border: 1px solid black; text-align: center; }
.item { width: 100px; border: 1px solid red; text-align: left; }