1

How do I get a vertical scrollbar inside tbody?

HTML:

<table class="table table-striped table-bordered">
    <thead>
        <tr>
            <th>Header1</th>
            <th>Header2</th>
            <th>Header3</th>
            <th>Header4</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Cell1</td>
            <td>Cell2</td>
            <td>Cell3</td>
            <td>Cell4</td>
        </tr>
    </tbody>
</table>

Table should be responsive and have a width set to 100%

In my code there is 13 headers like this: https://jsfiddle.net/r5Ly00mq/

Madsen
  • 293
  • 3
  • 13
  • This should be answer to your question. http://stackoverflow.com/questions/14834198/table-scroll-with-html-and-css – D. Schreier Oct 26 '16 at 14:32
  • 1
    Does this answer your question? [HTML table with 100% width, with vertical scroll inside tbody](https://stackoverflow.com/questions/17067294/html-table-with-100-width-with-vertical-scroll-inside-tbody) – mickmackusa May 27 '20 at 12:52

1 Answers1

-1
thead, tbody { display: block; }

tbody {
    height: 100px;       /* Just for the demo          */
    overflow-y: auto;    /* Trigger vertical scroll    */
    overflow-x: hidden;  /* Hide the horizontal scroll */
}

See "HTML table with 100% width, with vertical scroll inside tbody" for more information.

the Tin Man
  • 158,662
  • 42
  • 215
  • 303
Razia sultana
  • 2,168
  • 3
  • 15
  • 20
  • 2
    When you want to recommend advice that already exists on Stack Overflow, the correct way to resolve the page is not to post an answer, but to flag/vote to close the page as a duplicate. – mickmackusa May 27 '20 at 12:50