JSFiddle - React, Tailwind, and code Playground

HTML

<div class="top">
<div class="head"></div>
<div class="menu"></div>
</div>

<div class="down">

<div class="left">
  <div class="clearfix top"><div class="top"></div></div>
  <div class="clearfix down"><div class="down"></div></div>
</div>

<div class="center">
  <div class="clearfix content"><div class="content"></div></div>
  <div class="clearfix footer"><div class="footer"></div></div>
</div>

<div class="right">
<div class="clearfix gallery"><div class="gallery">
  <div class="img"></div>
  <div class="img"></div>
  <div class="img"></div>
</div></div>
</div>

</div>

CSS

*{opacity:.9}
html{overflow:hidden}
body>*{position:absolute}
.clearfix{position:absolute;overflow:auto}

body>.top{top:0;left:0;right:0;height:100px;background:red}
body>.down{top:100px;left:0;right:0;bottom:0;background:green}

body>.top>*{height:50px;width:100%}
body>.top>.head{background:yellow}
body>.top>.menu{background:blue}

body>.down>*{position:absolute}
body>.down>.left{left:0;top:0;bottom:0;width:100px;background:brown}
body>.down>.center{left:100px;top:0;bottom:0;right:100px;background:orange}
body>.down>.right{top:0;bottom:0;right:0;width:100px;background:cyan}

body>.down>.left>.clearfix.top{top:0;left:0;right:0;height:100px}
body>.down>.left>.clearfix.down{top:100px;left:0;right:0;bottom:0}
body>.down>.left>.clearfix>.top{height:100px;background:lime}
body>.down>.left>.clearfix>.down{height:2000px;background:violet}

body>.down>.center>.clearfix.content{top:0;right:0;left:0;bottom:50px}
body>.down>.center>.clearfix.footer{right:0;left:0;bottom:0;height:50px}
body>.down>.center>.clearfix>.content{height:2000px;background:crimson}
body>.down>.center>.clearfix>.footer{height:100%;background:pink}

body>.down>.right>.clearfix.gallery{top:0;left:0;right:0;bottom:0}
body>.down>.right>.clearfix>.gallery{padding:10px;background:darkblue}
body>.down>.right>.clearfix>.gallery>.img{margin-bottom:10px;width:100%;height:300px;background:gold}
body>.down>.right>.clearfix>.gallery>.img:last-child{margin:0}