JSFiddle - React, Tailwind, and code Playground

by id0

HTML

<div class="top">
  <div class="scrolled">
    <div class="second"></div>
  </div>
</div>

CSS

.top {
  position: fixed;
  top: 0;
  left: 0;
  right: 50%;
  bottom: 50%;
  background: #000;
  max-width: 20%;
  overflow: hidden;
  z-index: 23;
}

.scrolled {
  position: relative;
  overflow: hidden;
}

.second {
  position: fixed;
  top: 25%;
  left: 25%;
  right: 0;
  bottom: 0;
  background: #555;
  z-index: 11;
}