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 .responsive-table class.

Responsive - Method 2

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

Striped

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

Hoverable rows

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

Bordered table

For fully bordered table, add the .bordered class.

No borders

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

Centered table

The .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.