JSFiddle - React, Tailwind, and code Playground

HTML

<main>Main content</main>
	<nav>Navigation</nav>
	<footer>Footer</footer>

CSS

html {
    height: 100%;
}
body {
    display: flex;
    flex-direction: column;
    height: 100%;
    margin: 0;
}
body >* {
    background-color: #333;
    color: #bdbdbd;
    box-shadow: 0px 0px 10px 2px #000;
    text-shadow: 0 -1px 0 #000;
    padding: 10px;
}
main {
    height: 500px;
    order:1;
}
nav {
    order:0;
    z-index:2;
}
footer {
    order:2;
}