JSFiddle - React, Tailwind, and code Playground

HTML

<div class="page">
    <div class="header">header</div>
    <div class="aside">aside</div>
    <div class="content">content</div>
    <div class="clear_footer"></div>
    <div class="footer">footer</div>
</div>

CSS

html,body{
    margin:0px;
    height:100%;
}
.page{
    position:relative;
    min-height:100%;
    background:#fff;
}
.header{
    height:50px;
    background:#b00;
}
.aside{
    float:left;
    margin-top:10px;
    width:200px;
    border:1px dashed #000;
}
.content{
    position:relative;
    margin-top:10px;
    margin-left:220px;
    z-index:1;
}
.footer{
    position:absolute;
    bottom:0px;
    width:100%;
    height:50px;
    background:#0b0;
    z-index:1;
}
.page:before{
    content:'';
    position:absolute;
    background:#bbb;
    left:210px;
    right:10px;
    top:60px;
    bottom:60px;
    z-index:0;
}
.clear_footer{
    position:relative;
    padding-top:60px;
    width:100%;
    z-index:0;
}