JSFiddle - React, Tailwind, and code Playground

HTML

<body>
<div class="header">
  Header - I'd like a scroll/mousewheel event here to be transfered to the container<br>
  <br>
  scroll me - nothing happens<br>
  <br>
  can this scroll/mousewheel event be transfered to the '.container' ?
</div>
<div class="container">
Container<br><br>scroll me - the container scrolls
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
Just to create overflow
</div>
</body>

CSS

.header {
  position: absolute;
  top:0;
  left:0;
  right:0;
  height: 200px;
  background-color: #f88;
}

.container {
  position: absolute;
  top: 200px;
  left:0;
  right:0;
  bottom:0;
  background-color: #8f8;
  overflow-y: auto;
}