JSFiddle - React, Tailwind, and code Playground

HTML

<body>
    <div id="header">
        Header
    </div>
    <div id="view">
        View
    </div>
</body>

CSS

div,body {
    padding: 0px;
    margin: 0px;
}
body {
    height: 100vh;
    width: 100vw;
}
#header {    
    height: 50px;
    width: 100%;
    background-color: yellow;
}
#view {
    /* how to do that not knowing about 50px here? */
    height: calc(100vh - 50px);
    width: 100%;
    background-color: green;
}