JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <div class="topLHead head">Top Left</div>
    <div class="botLHead head">Bottom Left</div>
    <div>
        <div class="topHeads">
            <div class="head">Head</div>
            <div class="head">Head</div>
            <div class="head">Head</div>
            <div class="head">Head</div>
            <div class="head">Head</div>
            <div class="head">Head</div>
            <div class="head">Head</div>
            <div class="head">Head</div>
        </div>
        <div class="botHeads">
            <div class="head">Head</div>
            <div class="head">Head</div>
            <div class="head">Head</div>
            <div class="head">Head</div>
            <div class="head">Head</div>
            <div class="head">Head</div>
            <div class="head">Head</div>
            <div class="head">Head</div>
        </div>
    </div>
    <div class="tables">
        <table id="left_table"></table>
    </div>
</div>

CSS

* {
    margin: 0;
    padding: 0;
}
#container {
    font-size: 10pt;
    position: relative;
    width: 700px;
    height: 350px;
    background-color: #eee;
    overflow: auto;
    white-space: nowrap;
}
.topLHead {
    z-index: 100;
    position: fixed;
    top: 0;
    left: 0;
}
.botLHead {
    z-index: 100;
    position: absolute;
    bottom: 0;
    left: 0;
}
.head {
    width: 100px;
    height: 50px;
    text-align: center;
    padding-top: 10px;
    background-color: white;
}
.topHeads > div, .botHeads > div {
    float: left;
}
.topHeads {
    position: absolute;
    left: 100px;
}
.botHeads {
    position: absolute;
    left: 100px;
    bottom: 0;
}
.tables {
    clear: both;
    position: relative;
    overflow: auto;
    height: 220px;
    top: 55px;
}

JavaScript

$(function () {
    function getRows(rows, cols) {
        var rowString = "";
        for (var i = 0; i < cols; i++) {
            rowString += "<tr>";
            for (var j = 0; j < rows; j++) {
                rowString += "<td>" + j + "," + i + "</td>";
            }
            rowString += "</tr>";
        }
        return rowString;
    }

    $("#left_table").append(getRows(1, 20));
    $("#inner_table").append(getRows(8, 13));
});