mirror of
https://github.com/twbs/bootstrap.git
synced 2022-11-09 12:25:43 -05:00
Move .table-responsive to .table instead of as a parent
This commit is contained in:
parent
5ab99abd97
commit
967ee175dc
1 changed files with 132 additions and 140 deletions
|
@ -442,8 +442,7 @@ Add `.table-sm` to make tables more compact by cutting cell padding in half.
|
||||||
|
|
||||||
Use contextual classes to color table rows or individual cells.
|
Use contextual classes to color table rows or individual cells.
|
||||||
|
|
||||||
<div class="table-responsive">
|
<table class="table table-bordered table-striped table-responsive">
|
||||||
<table class="table table-bordered table-striped">
|
|
||||||
<colgroup>
|
<colgroup>
|
||||||
<col class="col-1">
|
<col class="col-1">
|
||||||
<col class="col-7">
|
<col class="col-7">
|
||||||
|
@ -486,8 +485,7 @@ Use contextual classes to color table rows or individual cells.
|
||||||
<td>Indicates a dangerous or potentially negative action</td>
|
<td>Indicates a dangerous or potentially negative action</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="bd-example">
|
<div class="bd-example">
|
||||||
<table class="table">
|
<table class="table">
|
||||||
|
@ -670,7 +668,7 @@ Regular table background variants are not available with the inverse table, howe
|
||||||
|
|
||||||
## Responsive tables
|
## Responsive tables
|
||||||
|
|
||||||
Create responsive tables by wrapping any `.table` in `.table-responsive` to make them scroll horizontally on small devices (under 768px). When viewing on anything larger than 768px wide, you will not see any difference in these tables.
|
Create responsive tables by adding `.table-responsive` to any `.table` to make them scroll horizontally on small devices (under 768px). When viewing on anything larger than 768px wide, you will not see any difference in these tables.
|
||||||
|
|
||||||
{% callout warning %}
|
{% callout warning %}
|
||||||
#### Vertical clipping/truncation
|
#### Vertical clipping/truncation
|
||||||
|
@ -693,8 +691,7 @@ For more information, read [this Stack Overflow answer](https://stackoverflow.co
|
||||||
{% endcallout %}
|
{% endcallout %}
|
||||||
|
|
||||||
<div class="bd-example">
|
<div class="bd-example">
|
||||||
<div class="table-responsive">
|
<table class="table table-responsive">
|
||||||
<table class="table">
|
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th>#</th>
|
<th>#</th>
|
||||||
|
@ -736,10 +733,8 @@ For more information, read [this Stack Overflow answer](https://stackoverflow.co
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="table-responsive">
|
<table class="table table-bordered table-responsive">
|
||||||
<table class="table table-bordered">
|
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th>#</th>
|
<th>#</th>
|
||||||
|
@ -781,15 +776,12 @@ For more information, read [this Stack Overflow answer](https://stackoverflow.co
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{% highlight html %}
|
{% highlight html %}
|
||||||
<div class="table-responsive">
|
<table class="table table-responsive"">
|
||||||
<table class="table">
|
|
||||||
...
|
...
|
||||||
</table>
|
</table>
|
||||||
</div>
|
|
||||||
{% endhighlight %}
|
{% endhighlight %}
|
||||||
|
|
||||||
|
|
||||||
|
|
Loading…
Add table
Reference in a new issue