JSFiddle - React, Tailwind, and code Playground

by theadam

HTML

<table>
  <tbody>
    <tr>
      <td colspan="1" rowspan="3">
        DATA
      </td>
      <td class="cell-hidden" colspan="1" rowspan="2">
        DATA
      </td>
      <td class="cell-hidden" colspan="1" rowspan="1">
        DATA
      </td>
    </tr>
    <tr>
      <td class="cell-hidden" colspan="1" rowspan="1">
        DATA
      </td>
    </tr>
    <tr>
      <td colspan="2" rowspan="1">
        DATA
      </td>
    </tr>
    <tr>
      <td colspan="3" rowspan="1">
        DATA
      </td>
    </tr>
    <tr>
      <td colspan="3" rowspan="1">
        DATA
      </td>
    </tr>
  </tbody>
</table>

CSS

td {
  border: 1px solid black;
}

.cell-hidden {
  display: none;
}