JSFiddle - React, Tailwind, and code Playground

by whelkaholism

HTML

<div id="outerfixed">
        <h3>OUTERFIXED</h3>
        <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 {position: fixed; overflow:hidden; height:400px; width:200px;  background-color:blue; padding:5px; top:0px; bottom:30px; }
#innerstatic2 {position: absolute; overflow:auto; background-color:red; min-height:100%; }