JSFiddle - React, Tailwind, and code Playground

by HaJIuBauKa

HTML

<table>
    <thead>
        <tr>
            <td>ID</td>
            <td>Problem</td>
            <td>Solution</td>
        </tr>
    </thead>
    <tbody>
    </tbody>
</table>

CSS

table {
    background-color: #aaa;
    width: 300px;
}
tbody {
    background-color: #ddd;
    height: 200px;
    overflow: auto;
}
td {
    padding: 3px 10px;
}

thead > tr, tbody{
    display:block;}

JavaScript

$(function() {
    for (var i = 0; i < 30; i++) {
        var a = Math.floor(10 * Math.random());
        var b = Math.floor(10 * Math.random());
        var row = $("<tr>").append($("<td>").html(i + 1))
                           .append($("<td>").html(a + " + " + b + " ="))
                           .append($("<td>").html(a + b));
        $("tbody").append(row);
    }
});