JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
    content
</div>
<div class="footer">
    footer
</div>

CSS

html, body {
    height: 100%;
}
.wrapper {
    min-height: 100%
}
.footer {
    height: 50px;
    margin: -50px 0 0;
    background: #f00;
}
body:before {
content:"";
height:100%;
float:left;
width:0;
margin-top:-32767px;
}