JSFiddle - React, Tailwind, and code Playground

HTML

<table width="100%" cellspacing="0" cellpadding="4" border="1" height="120">
  <tr>
    <td>Baseline</td>
    <td>Middle</td>
    <td>Top</td>
    <td>Bottom</td>
    <td><p>BIG</p>(baseline)</td>
  </tr>
</table>

CSS

td:nth-child(1)
      {
        vertical-align: baseline;
      }
td:nth-child(2)
      {
        vertical-align: middle;
      }
td:nth-child(3)
      {
        vertical-align: top;
      }
td:nth-child(4)
      {
        vertical-align: bottom;
      }
td:nth-child(5)
      {
        vertical-align: baseline;
      }
p
      {
        font: 2em/1.5 sans-serif;
        margin: 0;
        background: #ccc;
      }