mirror of
https://github.com/tenrok/bootstrap.git
synced 2026-05-30 15:24:08 +03:00
implement ie7 fluid tests and semantic.gs IE7 hack for rounding in ie7; not perfect, but mostly solid
This commit is contained in:
@@ -583,6 +583,7 @@
|
||||
|
||||
.span (@columns) {
|
||||
width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1));
|
||||
*width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%);
|
||||
}
|
||||
|
||||
.row-fluid {
|
||||
@@ -592,6 +593,7 @@
|
||||
.input-block-level();
|
||||
float: left;
|
||||
margin-left: @fluidGridGutterWidth;
|
||||
*margin-left: @fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%);
|
||||
}
|
||||
[class*="span"]:first-child {
|
||||
margin-left: 0;
|
||||
|
||||
@@ -33,3 +33,17 @@ h4 {
|
||||
#fluidRowInputs .row-fluid > [class*=span] {
|
||||
background-color: rgba(255,0,0,.1);
|
||||
}
|
||||
|
||||
|
||||
/* Fluid grid */
|
||||
.fluid-grid .row {
|
||||
height: 60px;
|
||||
padding-top: 10px;
|
||||
margin-top: 10px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
background-color: #eee;
|
||||
}
|
||||
.fluid-grid .span1 {
|
||||
background-color: #999;
|
||||
}
|
||||
|
||||
@@ -54,6 +54,241 @@
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- Fluid grid
|
||||
================================================== -->
|
||||
|
||||
<div class="page-header">
|
||||
<h1>Fluid grids</h1>
|
||||
</div>
|
||||
|
||||
<div class="fluid-grid">
|
||||
<div class="row">
|
||||
<div class="span12">12
|
||||
<div class="row-fluid">
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span11">11
|
||||
<div class="row-fluid">
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span1">1
|
||||
<div class="row-fluid">
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span10">10
|
||||
<div class="row-fluid">
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span2">2
|
||||
<div class="row-fluid">
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span9">9
|
||||
<div class="row-fluid">
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span3">3
|
||||
<div class="row-fluid">
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span8">8
|
||||
<div class="row-fluid">
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span4">4
|
||||
<div class="row-fluid">
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span7">7
|
||||
<div class="row-fluid">
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span5">5
|
||||
<div class="row-fluid">
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span6">6
|
||||
<div class="row-fluid">
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span6">6
|
||||
<div class="row-fluid">
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
<div class="span1">1</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- fluid grids -->
|
||||
|
||||
|
||||
|
||||
<!-- Tables
|
||||
================================================== -->
|
||||
|
||||
|
||||
@@ -197,6 +197,7 @@
|
||||
@gridColumns: 12;
|
||||
@gridColumnWidth: 60px;
|
||||
@gridGutterWidth: 20px;
|
||||
@gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1));
|
||||
|
||||
// Fluid grid
|
||||
// -------------------------
|
||||
|
||||
Reference in New Issue
Block a user