JSFiddle - React, Tailwind, and code Playground

by Prakash Upadhyay

HTML

<span class="vertical-center">Center Text</span>

<span class="vertical-center-table-cell">Center Text</span>

CSS

.vertical-center {
  display: inline-flex;
  border: 1px solid #ddd;
  min-height: 100px;
  align-items: center;
}

.vertical-center-table-cell {
  display: table-cell;
  border: 1px solid #ddd;
  height: 100px;
  vertical-align: middle;
}