Table

We provided various options to simplify your data organization with table.
Tables have a basic design, to easily format your table simply add the .table class.

Responsive - Method 1

We provided 2 methods to get a responsive table. This is the "classic" method. You simply need to wrap the .table class into a .table-responsive class.

Responsive - Method 2

This method turn your thead items at the left of the table.
To make it, replace the .table-responsive class by the .table-responsive-2 class.

Striped

Add the .table-striped class to your table element to get a striped table.

Hoverable rows

You can add a hover effect on each row with .table-hover class.

Bordered table

For fully bordered table, add the .table-bordered class.

No borders

You wanna disable all borders ? Okay, add the .table-no-border class.

Centered table

The .table-centered class helps you to center the data in your table.

With a caption

Simply add a <caption></caption> into your table to automatically create a caption and center it at the bottom of the table.

Styling