JSFiddle - React, Tailwind, and code Playground
HTML
<div class="page" align="center">
<div class="banner">
<button id="background">Background fix</button>
<button id="overflow">Overflow fix</button>
</div>
<div class="cover">
<div class="menu"></div>
<div class="divfoto"></div>
</div>
</div>
CSS
.page {
background-color:#00FFFF;
height:100%;
}
.banner {
width:985px;
height:100px;
background-color:#00F;
border-bottom:#FFFFFF solid 1px;
}
.cover {
width:985px;
margin:0px;
}
.menu {
width:225px;
height:200px;
float:left;
background-color:#0F0
}
.divfoto {
width:760px;
height:200px;
float:left;
background-color:#FF0000
}
.backgroundfix { position: absolute; top: 0; bottom: 0; }
.overflowfix { overflow: hidden; }
JavaScript
$("#background").click(function () {
$("body").toggleClass("backgroundfix");
});
$("#overflow").click(function () {
$(".page").toggleClass("overflowfix");
});