JSFiddle - React, Tailwind, and code Playground

by afshinprofe

HTML

<div id="outerfixed">
        <h3>OUTERFIXED</h3>
        <div id="innerstatic1">
            <h3>INNERSTATIC1</h3>
        </div>
        <div id="innerstatic2">
            <div>
            <h3>INNERSTATIC2</h3>
           
            line<br />
                   line<br />
                   line<br />
                   line<br />
                   line<br />
                   line<br />   line<br />
                   line<br />
                   line<br />
                   line<br />
                   line<br />
                   line<br />
                   line<br />
                   line<br />
                   line<br />
                   line<br />
                   line<br />
                   line<br />
                   line<br />
                   line<br />
                   line<br />
            
            </div>
        </div>
    </div>

CSS

#outerfixed {overflow:hidden; height:400px; width:200px;  background-color:blue; padding:5px; top:0px; bottom:30px; }
        #innerstatic1 { width:100%; background-color:yellow; height:100px;}
        #innerstatic2 {max-height:290px; overflow:auto; background-color:red; width:100%; }