JSFiddle - React, Tailwind, and code Playground

HTML

<div class='parent'>
    <div class='menu'>
         <ul>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
             <li>asdfasdfs</li>
        </ul>
    </div>
    <div class='flyout'>
        <h3>content here</h3>
        <p>asdjfhaksdfjhvaskdfhj</p>
    </div>
</div>

CSS

.flyout{
    position:fixed;
    top:7px;
    left:477px;
}

.parent{
    position:absolute;
    top:0;
    max-height:200px;
    left:75px;
    display:block;
    background:red;
    border:blue 1px solid;
    height:1262px;
    width:400px;
    max-width:400px;
    overflow-y: auto;
    overflow-x: visible;
    z-index:1050;
    float:left;
}