JSFiddle - React, Tailwind, and code Playground

HTML

<div style="overflow: auto; height: 20em; width: 20em;">
    <table style="height: 100%; width: 100%;">
        <tr style="background-color: blue;">
            <td>
                <div>header</div>
            </td>
        </tr>
        <tr style="height: 100%;">
            <td style="background-color: yellow;">
                <div style="height: 100%; background-color: red; overflow-y: scroll;">
                    content
                </div>
            </td>
        </tr>
        <tr style="background-color: blue;">
            <td>
                <div>footer</div>
            </td>
        </tr>
    </table>
</div>