aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--docs/assets/css/bootstrap-responsive.css26
-rw-r--r--docs/assets/css/bootstrap.css13
-rw-r--r--less/mixins.less2
-rw-r--r--less/tests/css-tests.css14
-rw-r--r--less/tests/css-tests.html235
-rw-r--r--less/variables.less1
6 files changed, 291 insertions, 0 deletions
diff --git a/docs/assets/css/bootstrap-responsive.css b/docs/assets/css/bootstrap-responsive.css
index ab336de1e..4f6eb75ba 100644
--- a/docs/assets/css/bootstrap-responsive.css
+++ b/docs/assets/css/bootstrap-responsive.css
@@ -310,6 +310,7 @@
width: 100%;
min-height: 28px;
margin-left: 2.762430939%;
+ *margin-left: 2.709239449638298%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
@@ -320,39 +321,51 @@
}
.row-fluid .span12 {
width: 99.999999993%;
+ *width: 99.9468085036383%;
}
.row-fluid .span11 {
width: 91.436464082%;
+ *width: 91.38327259263829%;
}
.row-fluid .span10 {
width: 82.87292817100001%;
+ *width: 82.8197366816383%;
}
.row-fluid .span9 {
width: 74.30939226%;
+ *width: 74.25620077063829%;
}
.row-fluid .span8 {
width: 65.74585634900001%;
+ *width: 65.6926648596383%;
}
.row-fluid .span7 {
width: 57.182320438000005%;
+ *width: 57.129128948638304%;
}
.row-fluid .span6 {
width: 48.618784527%;
+ *width: 48.5655930376383%;
}
.row-fluid .span5 {
width: 40.055248616%;
+ *width: 40.0020571266383%;
}
.row-fluid .span4 {
width: 31.491712705%;
+ *width: 31.4385212156383%;
}
.row-fluid .span3 {
width: 22.928176794%;
+ *width: 22.874985304638297%;
}
.row-fluid .span2 {
width: 14.364640883%;
+ *width: 14.311449393638298%;
}
.row-fluid .span1 {
width: 5.801104972%;
+ *width: 5.747913482638298%;
}
input,
textarea,
@@ -533,6 +546,7 @@
width: 100%;
min-height: 28px;
margin-left: 2.564102564%;
+ *margin-left: 2.510911074638298%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
@@ -543,39 +557,51 @@
}
.row-fluid .span12 {
width: 100%;
+ *width: 99.94680851063829%;
}
.row-fluid .span11 {
width: 91.45299145300001%;
+ *width: 91.3997999636383%;
}
.row-fluid .span10 {
width: 82.905982906%;
+ *width: 82.8527914166383%;
}
.row-fluid .span9 {
width: 74.358974359%;
+ *width: 74.30578286963829%;
}
.row-fluid .span8 {
width: 65.81196581200001%;
+ *width: 65.7587743226383%;
}
.row-fluid .span7 {
width: 57.264957265%;
+ *width: 57.2117657756383%;
}
.row-fluid .span6 {
width: 48.717948718%;
+ *width: 48.6647572286383%;
}
.row-fluid .span5 {
width: 40.170940171000005%;
+ *width: 40.117748681638304%;
}
.row-fluid .span4 {
width: 31.623931624%;
+ *width: 31.5707401346383%;
}
.row-fluid .span3 {
width: 23.076923077%;
+ *width: 23.0237315876383%;
}
.row-fluid .span2 {
width: 14.529914530000001%;
+ *width: 14.4767230406383%;
}
.row-fluid .span1 {
width: 5.982905983%;
+ *width: 5.929714493638298%;
}
input,
textarea,
diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 8037a33a8..62a2327ec 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -313,6 +313,7 @@ a:hover {
width: 100%;
min-height: 28px;
margin-left: 2.127659574%;
+ *margin-left: 2.0744680846382977%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
@@ -325,50 +326,62 @@ a:hover {
.row-fluid .span12 {
width: 99.99999998999999%;
+ *width: 99.94680850063828%;
}
.row-fluid .span11 {
width: 91.489361693%;
+ *width: 91.4361702036383%;
}
.row-fluid .span10 {
width: 82.97872339599999%;
+ *width: 82.92553190663828%;
}
.row-fluid .span9 {
width: 74.468085099%;
+ *width: 74.4148936096383%;
}
.row-fluid .span8 {
width: 65.95744680199999%;
+ *width: 65.90425531263828%;
}
.row-fluid .span7 {
width: 57.446808505%;
+ *width: 57.3936170156383%;
}
.row-fluid .span6 {
width: 48.93617020799999%;
+ *width: 48.88297871863829%;
}
.row-fluid .span5 {
width: 40.425531911%;
+ *width: 40.3723404216383%;
}
.row-fluid .span4 {
width: 31.914893614%;
+ *width: 31.8617021246383%;
}
.row-fluid .span3 {
width: 23.404255317%;
+ *width: 23.3510638276383%;
}
.row-fluid .span2 {
width: 14.89361702%;
+ *width: 14.8404255306383%;
}
.row-fluid .span1 {
width: 6.382978723%;
+ *width: 6.329787233638298%;
}
.container {
diff --git a/less/mixins.less b/less/mixins.less
index e0cb5f8a5..b107955f5 100644
--- a/less/mixins.less
+++ b/less/mixins.less
@@ -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;
diff --git a/less/tests/css-tests.css b/less/tests/css-tests.css
index 95067048d..a4f07e936 100644
--- a/less/tests/css-tests.css
+++ b/less/tests/css-tests.css
@@ -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;
+}
diff --git a/less/tests/css-tests.html b/less/tests/css-tests.html
index a39dde53d..2c44f7d18 100644
--- a/less/tests/css-tests.html
+++ b/less/tests/css-tests.html
@@ -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
================================================== -->
diff --git a/less/variables.less b/less/variables.less
index ca8e3ae40..d8825fb07 100644
--- a/less/variables.less
+++ b/less/variables.less
@@ -197,6 +197,7 @@
@gridColumns: 12;
@gridColumnWidth: 60px;
@gridGutterWidth: 20px;
+@gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1));
// Fluid grid
// -------------------------
generated by cgit v1.2.3 (git 2.25.1) at 2026-06-06 19:49:35 +0000