Standard (Fluid Table)

<table>
  ...
</table>
Table Header 1 Table Header 2 Table Header 3
Division 1 Division 2 Division 3
Division 1 Division 2 Division 3
Division 1 Division 2 Division 3

Large (Responsive Table)

<div class="table-responsive">
  <table>
    <thead>
      <tr>
        <th>[column title]</th>
        ...
      </tr>
    </thead>
    <tbody>
      <tr>
        <td data-label="[colum title]">[data]</td>
        ...
      </tr>
    </tbody>
  </table>
</div>
First Name Last Name Hero Title
Bruce Wayne Batman
Peter Parker Spiderman
Bruce Banner The Hulk
Clark Kent Superman

Overflow Scroll (XL Tables or Legacy Tables)

<div class="table-scroll">
  <table style="width: ...px;" >
  ...
  </table>
</div>
Table Header 1 Table Header 2 Table Header 3 Table Header 4 Table Header 5 Table Header 6 Table Header 7 Table Header 8 Table Header 9
Division 1 Division 2 Division 3 Division 4 Division 5 Division 6 Division 7 Division 8 Division 9
Division 1 Division 2 Division 3 Division 4 Division 5 Division 6 Division 7 Division 8 Division 9
Division 1 Division 2 Division 3 Division 4 Division 5 Division 6 Division 7 Division 8 Division 9
Division 1 Division 2 Division 3 Division 4 Division 5 Division 6 Division 7 Division 8 Division 9
Division 1 Division 2 Division 3 Division 4 Division 5 Division 6 Division 7 Division 8 Division 9
Division 1 Division 2 Division 3 Division 4 Division 5 Division 6 Division 7 Division 8 Division 9
Division 1 Division 2 Division 3 Division 4 Division 5 Division 6 Division 7 Division 8 Division 9
Division 1 Division 2 Division 3 Division 4 Division 5 Division 6 Division 7 Division 8 Division 9
Division 1 Division 2 Division 3 Division 4 Division 5 Division 6 Division 7 Division 8 Division 9