JSFiddle - React, Tailwind, and code Playground
HTML
<div class="wrapper">
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
</div>
CSS
*,*:before,*:after {box-sizing:border-box;}
.wrapper{
position:relative;
width:460px;
border:1px solid black;
padding: 0 8px;
margin: 0;
height: 600px;
overflow:hidden;
}
.wrapper:hover {
overflow-y:auto;
}
.item {
position: relative;
width:100%;
height: 150px;
background-color: gray;
margin: 8px 0;
}