JSFiddle - React, Tailwind, and code Playground

HTML

<div id="header"></div>

<div id="content">
    <iframe src="http://www.google.com"></iframe>
</div>

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

CSS

html, body {position:relative;padding: 0;height: 100%;}

#header {position:absolute;height:100px;width:100%;background:red;}
#footer {position:absolute;height:100px;width:100%;background:blue;bottom:0;}

#content {
    position: absolute;
    top: 100px;
    bottom: 100px;
    left: 0;
    right: 0;
}

#content iframe {
    display: block;
    border: 0;
    margin: 0 auto;
    width: 1000px;
    height: 100%;
}