JSFiddle - React, Tailwind, and code Playground

HTML

<div class="fixit">
<div class="box one"></div>

<div class="box two"></div>

<div class="box three"></div>
</div>

<div class="wrapper">
<div class="stage one"></div>

<div class="stage two"></div>

<div class="stage three"></div>
</div>

CSS

html, body {
    height: 100%;
    position: relative;
    overflow: hidden;
}

.fixit {
    position: absolute;
    top: 10px;
    left: 10px;
    width:50px;
    height:50px;
    z-index: 2;
}
.wrapper {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: auto;
}
.stage{width:100%;height:1000px;position:relative;}

/* overflow:hidden; position:static */

.stage.one{background:red;}
.stage.two{background:green;}
.stage.three{background:blue;}

.box{width: 100%; height: 100%;}

.box.one{background:purple;}
.box.two{background:orange;}
.box.three{background:yellow;}