Responsive Tables

Apart from the Bootstrap responsive table, you can choose to have a different behaviour based on need.

Stacked Responsive Table

The Stacked Responsive Table realigns the table cells and turns the table to a stacked table - when the table is viewed on a small screen.

Claim Examples
Claim Number Provider Name Service Date Tel Number
12312312 A Provider Name 21/5/12 234234234
12312312 A Provider Name 21/5/12 234234234
12312312 A Provider Name 21/5/12 234234234
12312312 A Provider Name 21/5/12 234234234
12312312 A Provider Name 21/5/12 234234234
HTML
<table id="stacked" class="table-condensed table-striped table-bordered rwdtable-stack">
    <caption>Claim Examples</caption>
    <thead>
        <tr>
            <th scope="col">col1</th>
            <th scope="col">col2</th>
            <th scope="col">col3</th>
            <th scope="col">col4</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td data-title="A">...</td>
            <td data-title="B">...</td>
            <td data-title="C">...</td>
            <td data-title="D">...</td>
        </tr>
    </tbody>
</table>

JAVASCRIPT - jQuery Ready()
$('.rwdtable-stack').rwdtable();