JSFiddle - React, Tailwind, and code Playground

by Nir Azuelos

HTML

<div class="wrapper">
    <section>
        <header>
Header<br />

            Header<br />

            Header<br />

            Header<br />
            Header<br />

            Header<br />

            Header<br />
Header<br />
Header<br />
Header<br />
Header<br />


        </header>
        <div id="content">
            Content is heres
            <p style="height: 1200px;">P</p>s
        </div>
    </section>
</div>

CSS

html {
    width: 100%;
    height: 100%;
}

.wrapper {
    height: 500px;
}

section {
    display: flex;
    flex-direction: column;
    
}

header {
    background: gray;
    height: 400px;
}

div#content {
    overflow-y: auto;
    background: yellow; 
}