JSFiddle - React, Tailwind, and code Playground

HTML

<h1> Header</h1>
<menu><ul><li>home</li><li>contact us</li></ul></menu>

<div class="book">
    <h3>Book</h3>
    <div class="page left">
        <h3>Page 1</h3>
        scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br /> scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />
    </div>
    
   <div class="page right">
       <h3>Page 2</h3>
       scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main scrollbar<br />scroll from main...

CSS

.page {
    width: 40%;
    height: 400px;
    float: left;
    overflow: auto;
}

.book { /* ignore */
    border: 5px solid red;
    padding: 3px;
}

.page { /* ignore */
    border: 1px solid blue;
    padding: 3px;
     margin-left: 30px;
}

.book footer { /* ignore */
    clear:both;
   height: 20px;
}

.outsideBookSpace { /* ignore */
    height: 500px;
}