JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head>
<style type="text/css">

</style>

</head>

<body>

<div id="wrapper">

    <div id="header">
        <p>Header</p>
    </div>
    <div id="content">
    INHALT  
    </div>

</div>

<div id="footer">
    <p>Footer</p>
</div>

</body>
</html>

CSS

html, body {
        height:100%;
        text-align:center;
    }

#wrapper {
    min-height:100%;
    height:100%;
    overflow: hidden;
    width:800px;
    margin: 0 auto;
    text-align: left;
    background-color:lightblue;
}   

#footer {
    background-color: silver;
    height:1.5em;
    width:800px;
    margin: -1.5em auto;
}

#header {
    background-color: orange;
    height:20%;
}

#content {
    background-color: limegreen;
    height:80%;
    min-height:100%;
}

* {
    margin:0;
    padding:0;
}