JSFiddle - React, Tailwind, and code Playground

HTML

<div id=container>
        <header>
            logo
       </header>
<section class=content>		

    123<br>
    123<br>
    123<br>
    123<br>
    123<br>
    123<br>
    123<br>
    123<br>
    123<br>

</section>
<footer>
        footer
</footer>
</div><!-- end container -->

CSS

html, body {height: 100%; margin: 0; padding: 0}
header, section, footer {display:block}
#container {
	height: 100%;
	position: relative;
	max-width: 1200px;
	min-width:980px;
	margin: 0 auto;
}
header {
	border-top: 3px solid green;
	border-bottom: 3px solid green;
	max-width: 1200px;
        width: 100%;
	min-width: 980px;
	position: fixed;
	z-index: 1;
	height: 105px;
	background-color: #fff;
}
section.content {
	min-height: 100%;
	padding-top: 105px;
	position: relative;
	background-color: green;
	padding-bottom: 100px;   /* Высота футера*/
}
footer {
height:100px;
margin-top: -100px;
position:relative;
background: #6cf;
}