JSFiddle - React, Tailwind, and code Playground
HTML
<div id="container1"><div id="container2">
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
good<br/>bye.
</div><div>
CSS
#container1{
height: 100% !important;
width: 100% !important;
border: 1px solid green;
overflow: hidden !important;
}
#container2{
width: 100% !important;
height: 99% !important;
border: 1px solid blue;
overflow: auto !important;
padding-right: 15px !important;
}
html, body{
height: 99% !important;
border: 1px solid red;
overflow:hidden !important;
}