JSFiddle - React, Tailwind, and code Playground

by Kevin Bratt

HTML

<table>
  <tbody>
    <tr>
      <td>
        <div><span>bert</span></div>
      </td>
      <td>
        <div><span>bert</span></div>
      </td>
      <td>
        <div><span>bert</span></div>
      </td>
    </tr>
    <tr>
      <td>
        <div><span>bert</span></div>
      </td>
      <td>
        <div><span>bert</span></div>
      </td>
      <td>
        <div><span>bert</span></div>
      </td>
    </tr>
    <tr>
      <td>
        <div><span>bert</span></div>
      </td>
      <td>
        <div><span>bert</span></div>
      </td>
      <td>
        <div><span>bert</span></div>
      </td>
    </tr>
  </tbody>
</table>

CSS

table,
th,
td {
  border: 1px solid black;
}

span {
  vertical-align: bottom;
}

div {
  animation: venetian 2s infinite;
  overflow: hidden;
  vertical-align: middle;
  height: 45px;
}

@keyframes venetian {
  from {
    height: 45px;
  }
  50% {
    height: 5px;
  }
  to {
    height: 45px;
  }
}

JavaScript

windows.onload();