JSFiddle - React, Tailwind, and code Playground

HTML

<header>head</header>
<main>
Curabitur aliquam convallis luctus. Vestibulum dolor turpis, consectetur a placerat eget, pellentesque id eros. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
</main>
<footer>foot</footer>

CSS

header {
    background: red;
}

body {
    position: relative;
}

main {
    background: aqua;
    font-size: 48px;
}

footer {
    position:absolute;
    background-color: grey;
    bottom:0;
    width: calc(100% - 40px);
    padding: 20px;
}