JSFiddle - React, Tailwind, and code Playground

by Mihail Tarlyovski

HTML

<div id="frame">
    <div id="header">header</div>
    <div id="container">Content</div>
    <div id="footer">Footer</div>
</div>

CSS

body{
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
    position: absolute;
}

#frame{
   display: table;
   height: 100%;
   width: 100%;
   position: absolute;
}

#header{
   display: table-row;
   height: 100px;
   background-color: red;
}

#container{
   display: table-row;
}

#footer{
   display: table-row;
   height: 100px;
   background-color: blue;
}