JSFiddle - React, Tailwind, and code Playground

HTML

<div class="non-scroll">
    <div class="scroll" id="scroll">
        <div class="other-stuff"></div>
    </div>
</div>

CSS

.non-scroll{
    height: 2000px;
    background-color: green;
}

.scroll{
    height: 300px;
    overflow: auto;
    background-color: blue;
}

.other-stuff{
    height: 2000px;
}

JavaScript

var scroll = document.getElementById("scroll");

scroll.addEventListener("mousewheel", function(e) {
	this.scrollTop -= (e.wheelDeltaY || (e.originalEvent && (e.originalEvent.wheelDeltaY || e.originalEvent.wheelDelta)) || e.wheelDelta || 0);
    e.stopPropagation();
    e.preventDefault();
});