JSFiddle - React, Tailwind, and code Playground

HTML

<body>
<div id="header">Nav area</div>
<div id="main">Main content to be here</div>
<div id="footer">Footer be here</div>  
</body>

CSS

body{
  background-color: gray;
  text-align:center;
}
#header{
  background: lightblue;
  height:30px
}
#main{
  background-color: orange;
  min-height:calc(100vh - 60px);
}
#footer{
  background-color: yellow;
  height:30px;
}