Cornerstone

Responsive Table Container

The table wrapper is used to wrap responsive table markup. When adding responsive table snippet, you will have to create a table inside the snippet block in the WYSIWYG.

<table class="stacked">
  <!-- table markup here -->
</table>
<table class="stack">
    <thead>
        <tr>
            <td></td>
            <th scope="col">Column 1</th>
            <th scope="col">Column 2</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th scope="row">Row Header</th>
            <td data-title="Column 1">Body</td>
            <td data-title="Column 2">Body</td>
        </tr>
        <tr>
            <th scope="row">Row Header</th>
            <td data-title="Column 1">Body</td>
            <td data-title="Column 2">Body</td>
        </tr>
        <tr>
            <th scope="row">Row Header</th>
            <td data-title="Column 1">Body</td>
            <td data-title="Column 2">Body</td>
        </tr>
    </tbody>
</table>