JSFiddle - React, Tailwind, and code Playground

HTML

<div class="head">
          <h1>Header</h1>
          <ul>
            <li>home</li>
            <li>contact us</li>
          </ul>
        </div>
    
        <div class="book">
    
          <table>
            <tr>
              <td>
                <div class="page1">
                  <h2>Page1</h2>
                  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...

CSS

body {
          margin-top: 150px;
          }
        
          .head {
          width: 100%;
          position: fixed;
          top: 0;
          background-color: white;
          border-bottom: 2px solid lightblue
          }
          
          .footer {
            width: 100%;
            position: fixed;
            bottom: 0;
            background-color: white;
            border-top: 2px solid lightblue
          }

          .book table td {
          vertical-align: top;
          }
    
          .page1, .page2 {
          border: solid 1px red;
          width: 400px;
          }