JSFiddle - React, Tailwind, and code Playground
HTML
<div id="container">
<div id="header"></div>
<div id="content">
@RenderBody()
</div>
</div>
<div id="footer"></div>
CSS
* { margin: 0; padding: 0 }
html,body { height: 100% }
#container { height: 100% }
#header {
height:115px;
position: relative;
color: #000;
background: green;
padding-top: 10px;
border-bottom:1px solid #fff;
-moz-box-shadow: 0 0 10px 10px #ccc;
-webkit-box-shadow: 0 0 10px 10px #ccc;
box-shadow: 0 0 10px 10px #ccc;
}
#content {
width: 100%;
left:0;
top: 125px;
bottom: 100px;
background: pink;
position:absolute;
overflow: auto;
}
#footer {
width:auto;
height:100px;
background:#d21f27;
margin-top:-100px;
clear:both;
}