<h1>Navigating a Scrolling Container</h1>

<p>
  The text in the table is large (200%) to try to force the horizontal scroll. If you still see no scroll bar on the table container, make your window smaller.
</p>

<div id="Meh">
  <p>
    <label for="Landing">Cursor landing spot:</label><br>
    <input type="text" id="Landing">
    <button type="button">Does Nothing</button>
  </p>
  
  <p>
    This text field is here solely so you can give it focus, which is explained in the post.
  </p>
</div>



<div class="caret-reliance">
    <table>
    <caption id="Caption01">Books in a Scrolling Container</caption>
    <thead>
      <tr>
        <th>Author</th>
        <th>Title</th>
        <th>Year</th>
        <th>ISBN-13</th>
        <th>ISBN-10</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>Miguel De Cervantes</td>
        <td>The Ingenious Gentleman Don Quixote of La Mancha</td>
        <td>1605</td>
        <td>9783125798502</td>
        <td>3125798507</td>
      </tr>
      <tr>
        <td>Gabrielle-Suzanne Barbot de Villeneuve</td>
        <td lang="fr">La Belle et la Bête</td>
        <td>1740</td>
        <td>9781910880067</td>
        <td>191088006X</td>
      </tr>
      <tr>
        <td>Sir Isaac Newton</td>
        <td>The Method of Fluxions and Infinite Series: With Its Application to the Geometry of Curve-lines</td>
        <td>1763</td>
        <td>9781330454862</td>
        <td>1330454863</td>
      </tr>
      <tr>
        <td>Mary Shelley</td>
        <td>Frankenstein; or, The Modern Prometheus</td>
        <td>1818</td>
        <td>9781530278442</td>
        <td>1530278449</td>
      </tr>
      <tr>
        <td>Herman Melville</td>
        <td>Moby-Dick; or, The Whale</td>
        <td>1851</td>
        <td>9781530697908</td>
        <td>1530697905</td>
      </tr>
      <tr>
        <td >Emma Dorothy Eliza Nevitte Southworth</td>
        <td>The Hidden Hand</td>
        <td>1888</td>
        <td>9780813512969</td>
        <td>0813512964</td>
      </tr>
      <tr>
        <td>F. Scott Fitzgerald</td>
        <td>The Great Gatsby</td>
        <td>1925</td>
        <td>9780743273565</td>
        <td>0743273567</td>
      </tr>
      <tr>
        <td>George Orwell</td>
        <td>Nineteen Eighty-Four</td>
        <td>1948</td>
        <td>9780451524935</td>
        <td>0451524934</td>
      </tr>
      <tr>
        <td>Nnedi Okorafor</td>
        <td>Who Fears Death</td>
        <td>2010</td>
        <td>9780756406691</td>
        <td>0756406692</td>
      </tr>
    </tbody>
  </table>
</div>

<p>
  Donec convallis sodales risus ut lobortis. Donec egestas tincidunt sem vitae maximus. Aenean eu auctor orci. Sed dignissim ante id mauris tempor venenatis. Pellentesque tempor, ex sit amet malesuada imperdiet, libero nisi pellentesque sem, at scelerisque dolor neque bibendum urna. Vivamus bibendum augue metus. Maecenas finibus felis quis arcu mattis, vel hendrerit risus feugiat.
</p>

<p>
  Table adapted from the post <cite><a href="https://adrianroselli.com/2020/11/under-engineered-responsive-tables.html">Under-Engineered Responsive Tables</a></cite>, and this entire experiment used in <cite><a href="https://adrianroselli.com/2022/06/keyboard-only-scrolling-areas.html">Keyboard-Only Scrolling Areas</a></cite>.
</p>