JSFiddle - React, Tailwind, and code Playground

HTML

<main>
<header>
 asdasd asdasd
 asdasd as
 dasdasdasdas 
 asdasdqweasdzxc
 asdasd
<header>
<section>I'm 100%</section>
</main>

CSS

html, body, #content {
    height:100%;
    position:relative; /*position can be anything*/
}
body{
    background-color:green;
    display: table;
}
header {
    background: blue;
    display: table-row;
}
main {
    height: 100%;
    background: tomato;
    display: table-row;
}