Responsive tables

The display of tables often causes problems in responsive web design. Responsive tables allow easy horizontal scrolling of tables.

Make a table responsive in all viewports by wrapping a .table with .table-responsive . Or use .table-responsive{-sm|-md|-lg|-xl} to select a maximum breakpoint up to which a responsive table should be displayed.

<div class="table-responsive">
  <table class="table">
    ...
  </table>
</div>

You can find more information in the official documentation of the Bootstrap framework:

Tablesgetbootstrap