rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-01 13:24:25 +01:00
Code Issues Actions Packages Releases Activity

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

Browse Source
This commit is contained in:
Mark Otto 2012-06-25 14:37:35 -07:00
parent 27845e4492
commit cd466f1d0b
3 changed files with 83 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
docs/assets/css/bootstrap.css vendored
View File

@ -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;

10
less/tables.less
View File

@ -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); }

67
less/tests/css-tests.html
View File

@ -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
================================================== --> ================================================== -->