JSFiddle - React, Tailwind, and code Playground

HTML

<div id="main">
    <div id="foo">foo</div>
</div>

CSS

html,body{
    height: 100%;
}
#main{
    height: 100%;
}
#foo{
    height: auto;
    /* height: 100%; */
}
#foo:before{
    content: "bar";
    height: 100%;
    display: block;
}