JSFiddle - React, Tailwind, and code Playground

HTML

<div id="headerWrapper">
    <div id="header">
        header</div>
    <div id="headerScrl">
     <p>SDAs</p>
   <p> asdfasf</p>
    <p> sdfsdf</p>
    <p>sdfsdfg</p>
        <p>SDAs</p>
   <p> asdfasf</p>
    <p> sdfsdf</p>
    <p>sdfsdfg</p>
    </div>
</div>

CSS

#headerWrapper{
    border:1px solid black;
     width:302px;
}
#header{
    border:1px solid red;
    width:300px;
    height:100px;
    background:green;
   
}
#headerScrl{
    width:300px;
    height:100px;
    overflow:scroll;
}