JSFiddle - React, Tailwind, and code Playground

by Cath_kb

HTML

<table cellspacing="0" cellpadding="0">
    <thead>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
    </tfoot>
    <tbody>
        <tr>
            <td colspan="2" rowspan="2">1</td>
            <td colspan="3">2</td>
        </tr>
        <tr>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td rowspan="2">6</td>
            <td>7</td>
            <td>8</td>
            <td>9</td>
            <td>10</td>
        </tr>
        <tr>
            <td>11</td>
            <td>12</td>
            <td>13</td>
            <td>14</td>
        </tr>
        <tr>
            <td colspan="2">15</td>
            <td colspan="3">16</td>
        </tr>
    </tbody>
</table>

CSS

td {
    border: 1px solid grey;
    border-collapse: collapse;
    text-align: center;
    vertical-align: middle;
}