Skip to content
GitLab
Commit cd466f1d authored by Mark Otto's avatar Mark Otto
Browse files

add tests for table grid sizing, solve bugs in fluid table grid sizing

parent 27845e44
Hide whitespace changes
Inline Side-by-side
Showing
with 83 additions and 1 deletion
+83 -1
docs/assets/css/bootstrap.css
+ 7
- 0
View file @ cd466f1d
...@@ -1753,6 +1753,13 @@ table { ...@@ -1753,6 +1753,13 @@ table {
background-color: #f5f5f5; background-color: #f5f5f5;
} }
table [class*=span],
.row-fluid table [class*=span] {
display: table-cell;
float: none;
margin-left: 0;
}
table .span1 { table .span1 {
float: none; float: none;
width: 44px; width: 44px;
......
less/tables.less
+ 9
- 1
View file @ cd466f1d
...@@ -147,7 +147,15 @@ table { ...@@ -147,7 +147,15 @@ table {
// TABLE CELL SIZING // TABLE CELL SIZING
// ----------------- // -----------------
// Change the columns // Reset default grid behavior
table [class*=span],
.row-fluid table [class*=span] {
display: table-cell;
float: none; // undo default grid column styles
margin-left: 0; // undo default grid column styles
}
// Change the column widths to account for td/th padding
table { table {
.span1 { .tableColumns(1); } .span1 { .tableColumns(1); }
.span2 { .tableColumns(2); } .span2 { .tableColumns(2); }
......
less/tests/css-tests.html
+ 67
- 0
View file @ cd466f1d
...@@ -458,6 +458,73 @@ ...@@ -458,6 +458,73 @@
</div><!--/row--> </div><!--/row-->
<h4>Grid sizing</h4>
<div class="row">
<div class="span12">
<table class="table table-bordered">
<thead>
<tr>
<th class="span3">1</th>
<th class="span4">2</th>
<th>3</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="2">1 and 2</td>
<td>3</td>
</tr>
<tr>
<td>1</td>
<td rowspan="2">2</td>
<td>3</td>
</tr>
<tr>
<td rowspan="2">1</td>
<td>3</td>
</tr>
<tr>
<td colspan="2">2 and 3</td>
</tr>
</tbody>
</table>
</div>
</div><!--/row-->
<h4>Fluid grid sizing</h4>
<div class="row-fluid">
<div class="span12">
<table class="table table-bordered">
<thead>
<tr>
<th class="span3">1</th>
<th class="span4">2</th>
<th>3</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="2">1 and 2</td>
<td>3</td>
</tr>
<tr>
<td>1</td>
<td rowspan="2">2</td>
<td>3</td>
</tr>
<tr>
<td rowspan="2">1</td>
<td>3</td>
</tr>
<tr>
<td colspan="2">2 and 3</td>
</tr>
</tbody>
</table>
</div>
</div><!--/row-->
<!-- Forms <!-- Forms
================================================== --> ================================================== -->
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment