JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<body>

<div id="sheet">
    <div id="header">&nbsp;</div>
    <div class="divider"></div>
    <div class="content">
        <div class="vmenu">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vitae odio vel massa consequat placerat. Proin gravida risus eget eros mattis convallis. Fusce eget elit fermentum elit rhoncus sodales facilisis eu libero. Fusce vitae nisl sem, ac suscipit eros. Quisque ullamcorper</div>
        <div class="pagecontent">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vitae odio vel massa consequat placerat. Proin gravida risus eget eros mattis convallis. </div>
    </div>
    <div class="divider"></div>
    <div id="footer">&nbsp;</div>
</div>

</body>
</html>

CSS

html, body {
    margin:0;
    padding:0;
    height:100%;
    width:100%;}
#sheet {
    width: 500px;
    margin: 0 auto;
    position: relative;
    min-height: 100%;
    height: 100%;
    display: table;}
#header {
    height:40px;
    display: table-cell;
    background:#333;}
.content {
    min-height:100%;
    display: table-row;
    background:#555;
    }
.divider {
    height: 10px;
    display: table-row;
    }
.vmenu {
    width:190px;
    float: left;
    margin:10px;
    background: silver;}
.pagecontent {
    margin:10px;
    overflow: hidden;
    background: darkblue;}
#footer {
    height: 50px;
    background: #4c4e5a;
    display: table-row;}