JSFiddle - React, Tailwind, and code Playground

by poztin

HTML

<table class="table1">
    <tr class="fixed">
        <td>
            Fixed height row
        </td>
    </tr>
    <tr>
        <td style="position:relative;">
            <div class="wrapper stretch-to-container">
                Content
            </div>
        </td>
    </tr>
</table>

CSS

html, body {
    margin:0;
    height:100%;
}

.stretch-to-container {
    display:block;
    position:absolute;
    height:auto;
    bottom:0;
    top:0;
    left:0;
    right:0;
}

.table1
{
    background-color:salmon;
    width:100%;
    height:100%;    
}
.fixed {
    background-color:lightgreen;
    height:30px;
}
.wrapper {
    background-color: steelblue;
}