JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script></script>
<style>
        html,body {
        width: 100%;
        height: 100%;
        background: white;
                margin: 0;
                padding: 0;
    }
        table {
                width: 100%;
                height: 100%;
                border-spacing: 10px;
        }
        td {
                padding: 0;
                background: red;
        }
</style>
</head>
<body>
<table>
        <col style="width: 200px;">
        <col style="width: 200px;">
        <col style="width: 200px;">
        <col style="width: 50px;">
        <col style="width: 100px;">
        <tr>
                <td rowspan="2"></td>
                <td colspan="2"></td>
                <td colspan="2"></td>
        </tr>
        <tr>
                <td rowspan="3"></td>
                <td colspan="3" rowspan="2"></td>
        </tr>
        <tr>
                <td rowspan="2"></td>
        </tr>
        <tr>
                <td colspan="2"></td>
                <td></td>
        </tr>
        <tr>
                <td colspan="2"></td>
                <td colspan="3"></td>
        </tr>
</table>
</body>
</html>