JSFiddle - React, Tailwind, and code Playground

HTML

<div style="height:100%; width:100%; background-color:pink; border-style:solid; border-width:2px;">
    <div style="background-color:pink; width:100%;">
        test
    </div>
    <div style="height:100%;width:100%; background-color:yellow;">
        test
    </div>
</div>
<hr>
<footer>footer</footer>

CSS

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
body
{
    min-height:100%;
    min-width:100%;
    position:absolute;
    border: 1px solid red;
    left:0px;
}
html
{
    height:100%;
    border: 1px solid blue;
}
footer {
    position: absolute;
    bottom: 0px;
    background: #00ee00;
    width: 100%;
}