JSFiddle - React, Tailwind, and code Playground
HTML
<div class="iframe_box">
<iframe id="iframe1" frameborder="0" name="iframe1" src="http://jsfiddle.net/"></iframe>
</div>
<div class="menu">
<div class="button-wrapper">
<button id="refresh_btn" title="Refresh Current Page" onclick="refreshIframe1();">Refresh Current Page</button>
</div>
</div>
CSS
html {
margin: 0;
padding:0;
height:100%;
}
body{
height:100%;
right: 0;
left:0;
margin: 0;
padding:0;
margin-top:0px;
overflow: hidden;
}
#iframe1 {
position:relative;
width:100%;
height:100%; /* Height of the box */
background:white;
border:0px solid red;
}
.iframe_box {
width:100%;
background:white;
padding:0px 0px 0px 0px;
margin-top:0px;
height:70%;
border:1px solid red;
}
.menu {
width:100%;
height:30%;
border:1px solid blue;
overflow: auto;
display: table;
background-color:blue;
}