Responsive tables
Responsive Basic Table
Create responsive tables by wrapping any .table
in .table-responsive
to make them scroll horizontally up to small devices (under 768px).
When viewing on anything larger than 768px wide, you will not see any difference in these tables.
# | Table heading | Table heading | Table heading | Table heading | Table heading | Table heading |
---|---|---|---|---|---|---|
1 | Table cell | Table cell | Table cell | Table cell | Table cell | Table cell |
2 | Table cell | Table cell | Table cell | Table cell | Table cell | Table cell |
3 | Table cell | Table cell | Table cell | Table cell | Table cell | Table cell |
4 | Table cell | Table cell | Table cell | Table cell | Table cell | Table cell |
5 | Table cell | Table cell | Table cell | Table cell | Table cell | Table cell |
6 | Table cell | Table cell | Table cell | Table cell | Table cell | Table cell |
Responsive Table in card with no padding
# | Table heading | Table heading | Table heading | Table heading | Table heading | Table heading |
---|---|---|---|---|---|---|
1 | Table cell | Table cell | Table cell | Table cell | Table cell | Table cell |
2 | Table cell | Table cell | Table cell | Table cell | Table cell | Table cell |
3 | Table cell | Table cell | Table cell | Table cell | Table cell | Table cell |
4 | Table cell | Table cell | Table cell | Table cell | Table cell | Table cell |
5 | Table cell | Table cell | Table cell | Table cell | Table cell | Table cell |
6 | Table cell | Table cell | Table cell | Table cell | Table cell | Table cell |