JSFiddle - React, Tailwind, and code Playground

by Kostia_Ivashchenko

HTML

<div class="div100percents">
    <table style="width: 100%; height: 100%;">
        <tr style="background: #fef; height: 36px;">
            <td>
                Header
            </td>
        </tr>
        <tr>
            <td style="background: #ffe; height: 100%;">
                <div class="divMain">
                    Content
                </div>
            </td>
        </tr>
        <tr style="background: #fcf; height: 36px;">
            <td>
                Footer
            </td>
        </tr>
    </table>
</div>

CSS

.div100percents {
    position: absolute;
    width: 100%;
    top: 0;
    bottom: 0;
}

.divMain {
    position: relative;
    width: 200px;
    min-height: 100%;
    margin: 0 auto;
    background: #eff;
}

body, table, tr, td {margin 0; padding 0;}