fix broken responsive utilities table
This commit is contained in:
parent
dd7bb71554
commit
2c6e854eea
|
@ -1949,54 +1949,56 @@ For example, <code><section></code> should be wrapped as inline.
|
||||||
<p class="lead">For faster mobile-friendly development, use these utility classes for showing and hiding content by device via media query. Also included are utility classes for toggling content when printed.</p>
|
<p class="lead">For faster mobile-friendly development, use these utility classes for showing and hiding content by device via media query. Also included are utility classes for toggling content when printed.</p>
|
||||||
|
|
||||||
<h3>Responsive classes</h3>
|
<h3>Responsive classes</h3>
|
||||||
<table class="table table-bordered table-striped responsive-utilities hidden-sm">
|
<div class="hidden-sm">
|
||||||
<thead>
|
<table class="table table-bordered table-striped responsive-utilities">
|
||||||
<tr>
|
<thead>
|
||||||
<th>Class</th>
|
<tr>
|
||||||
<th>Phones <small>767px and below</small></th>
|
<th>Class</th>
|
||||||
<th>Tablets <small>979px to 768px</small></th>
|
<th>Phones <small>767px and below</small></th>
|
||||||
<th>Desktops <small>Default</small></th>
|
<th>Tablets <small>979px to 768px</small></th>
|
||||||
</tr>
|
<th>Desktops <small>Default</small></th>
|
||||||
</thead>
|
</tr>
|
||||||
<tbody>
|
</thead>
|
||||||
<tr>
|
<tbody>
|
||||||
<th><code>.visible-sm</code></th>
|
<tr>
|
||||||
<td class="is-visible">Visible</td>
|
<th><code>.visible-sm</code></th>
|
||||||
<td class="is-hidden">Hidden</td>
|
<td class="is-visible">Visible</td>
|
||||||
<td class="is-hidden">Hidden</td>
|
<td class="is-hidden">Hidden</td>
|
||||||
</tr>
|
<td class="is-hidden">Hidden</td>
|
||||||
<tr>
|
</tr>
|
||||||
<th><code>.visible-md</code></th>
|
<tr>
|
||||||
<td class="is-hidden">Hidden</td>
|
<th><code>.visible-md</code></th>
|
||||||
<td class="is-visible">Visible</td>
|
<td class="is-hidden">Hidden</td>
|
||||||
<td class="is-hidden">Hidden</td>
|
<td class="is-visible">Visible</td>
|
||||||
</tr>
|
<td class="is-hidden">Hidden</td>
|
||||||
<tr>
|
</tr>
|
||||||
<th><code>.visible-lg</code></th>
|
<tr>
|
||||||
<td class="is-hidden">Hidden</td>
|
<th><code>.visible-lg</code></th>
|
||||||
<td class="is-hidden">Hidden</td>
|
<td class="is-hidden">Hidden</td>
|
||||||
<td class="is-visible">Visible</td>
|
<td class="is-hidden">Hidden</td>
|
||||||
</tr>
|
<td class="is-visible">Visible</td>
|
||||||
<tr>
|
</tr>
|
||||||
<th><code>.hidden-sm</code></th>
|
<tr>
|
||||||
<td class="is-hidden">Hidden</td>
|
<th><code>.hidden-sm</code></th>
|
||||||
<td class="is-visible">Visible</td>
|
<td class="is-hidden">Hidden</td>
|
||||||
<td class="is-visible">Visible</td>
|
<td class="is-visible">Visible</td>
|
||||||
</tr>
|
<td class="is-visible">Visible</td>
|
||||||
<tr>
|
</tr>
|
||||||
<th><code>.hidden-md</code></th>
|
<tr>
|
||||||
<td class="is-visible">Visible</td>
|
<th><code>.hidden-md</code></th>
|
||||||
<td class="is-hidden">Hidden</td>
|
<td class="is-visible">Visible</td>
|
||||||
<td class="is-visible">Visible</td>
|
<td class="is-hidden">Hidden</td>
|
||||||
</tr>
|
<td class="is-visible">Visible</td>
|
||||||
<tr>
|
</tr>
|
||||||
<th><code>.hidden-lg</code></th>
|
<tr>
|
||||||
<td class="is-visible">Visible</td>
|
<th><code>.hidden-lg</code></th>
|
||||||
<td class="is-visible">Visible</td>
|
<td class="is-visible">Visible</td>
|
||||||
<td class="is-hidden">Hidden</td>
|
<td class="is-visible">Visible</td>
|
||||||
</tr>
|
<td class="is-hidden">Hidden</td>
|
||||||
</tbody>
|
</tr>
|
||||||
</table>
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h3>Print classes</h3>
|
<h3>Print classes</h3>
|
||||||
<table class="table table-bordered table-striped responsive-utilities">
|
<table class="table table-bordered table-striped responsive-utilities">
|
||||||
|
|
Loading…
Reference in New Issue