kotovalexarian-likes-github/twbs--bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2022-11-09 12:25:43 -05:00
Code Releases Activity

clear up scaffolding page to separate fixed from fluid grid systems

Browse source
This commit is contained in:
Mark Otto 2012-02-12 16:59:29 -08:00
parent 16f2e0e19e
commit 5fc62c5fcc
6 changed files with 256 additions and 76 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
docs/assets/bootstrap.zip
View file

Binary file not shown.

48
docs/assets/css/bootstrap-responsive.css vendored
View file

@ -205,40 +205,40 @@
.row-fluid > [class*="span"]:first-child { .row-fluid > [class*="span"]:first-child {
margin-left: 0; margin-left: 0;
} }
.row-fluid .span1 { .row-fluid > .span1 {
width: 5.801104972%; width: 5.801104972%;
} }
.row-fluid .span2 { .row-fluid > .span2 {
width: 14.364640883%; width: 14.364640883%;
} }
.row-fluid .span3 { .row-fluid > .span3 {
width: 22.928176794%; width: 22.928176794%;
} }
.row-fluid .span4 { .row-fluid > .span4 {
width: 31.491712705%; width: 31.491712705%;
} }
.row-fluid .span5 { .row-fluid > .span5 {
width: 40.055248616%; width: 40.055248616%;
} }
.row-fluid .span6 { .row-fluid > .span6 {
width: 48.618784527%; width: 48.618784527%;
} }
.row-fluid .span7 { .row-fluid > .span7 {
width: 57.182320438000005%; width: 57.182320438000005%;
} }
.row-fluid .span8 { .row-fluid > .span8 {
width: 65.74585634900001%; width: 65.74585634900001%;
} }
.row-fluid .span9 { .row-fluid > .span9 {
width: 74.30939226%; width: 74.30939226%;
} }
.row-fluid .span10 { .row-fluid > .span10 {
width: 82.87292817100001%; width: 82.87292817100001%;
} }
.row-fluid .span11 { .row-fluid > .span11 {
width: 91.436464082%; width: 91.436464082%;
} }
.row-fluid .span12 { .row-fluid > .span12 {
width: 99.999999993%; width: 99.999999993%;
} }
input.span1, textarea.span1, .uneditable-input.span1 { input.span1, textarea.span1, .uneditable-input.span1 {
@ -486,40 +486,40 @@
.row-fluid > [class*="span"]:first-child { .row-fluid > [class*="span"]:first-child {
margin-left: 0; margin-left: 0;
} }
.row-fluid .span1 { .row-fluid > .span1 {
width: 5.982905983%; width: 5.982905983%;
} }
.row-fluid .span2 { .row-fluid > .span2 {
width: 14.529914530000001%; width: 14.529914530000001%;
} }
.row-fluid .span3 { .row-fluid > .span3 {
width: 23.076923077%; width: 23.076923077%;
} }
.row-fluid .span4 { .row-fluid > .span4 {
width: 31.623931624%; width: 31.623931624%;
} }
.row-fluid .span5 { .row-fluid > .span5 {
width: 40.170940171000005%; width: 40.170940171000005%;
} }
.row-fluid .span6 { .row-fluid > .span6 {
width: 48.717948718%; width: 48.717948718%;
} }
.row-fluid .span7 { .row-fluid > .span7 {
width: 57.264957265%; width: 57.264957265%;
} }
.row-fluid .span8 { .row-fluid > .span8 {
width: 65.81196581200001%; width: 65.81196581200001%;
} }
.row-fluid .span9 { .row-fluid > .span9 {
width: 74.358974359%; width: 74.358974359%;
} }
.row-fluid .span10 { .row-fluid > .span10 {
width: 82.905982906%; width: 82.905982906%;
} }
.row-fluid .span11 { .row-fluid > .span11 {
width: 91.45299145300001%; width: 91.45299145300001%;
} }
.row-fluid .span12 { .row-fluid > .span12 {
width: 100%; width: 100%;
} }
input.span1, textarea.span1, .uneditable-input.span1 { input.span1, textarea.span1, .uneditable-input.span1 {

24
docs/assets/css/bootstrap.css vendored
View file

@ -212,40 +212,40 @@ a:hover {
.row-fluid > [class*="span"]:first-child { .row-fluid > [class*="span"]:first-child {
margin-left: 0; margin-left: 0;
} }
.row-fluid .span1 { .row-fluid > .span1 {
width: 6.382978723%; width: 6.382978723%;
} }
.row-fluid .span2 { .row-fluid > .span2 {
width: 14.89361702%; width: 14.89361702%;
} }
.row-fluid .span3 { .row-fluid > .span3 {
width: 23.404255317%; width: 23.404255317%;
} }
.row-fluid .span4 { .row-fluid > .span4 {
width: 31.914893614%; width: 31.914893614%;
} }
.row-fluid .span5 { .row-fluid > .span5 {
width: 40.425531911%; width: 40.425531911%;
} }
.row-fluid .span6 { .row-fluid > .span6 {
width: 48.93617020799999%; width: 48.93617020799999%;
} }
.row-fluid .span7 { .row-fluid > .span7 {
width: 57.446808505%; width: 57.446808505%;
} }
.row-fluid .span8 { .row-fluid > .span8 {
width: 65.95744680199999%; width: 65.95744680199999%;
} }
.row-fluid .span9 { .row-fluid > .span9 {
width: 74.468085099%; width: 74.468085099%;
} }
.row-fluid .span10 { .row-fluid > .span10 {
width: 82.97872339599999%; width: 82.97872339599999%;
} }
.row-fluid .span11 { .row-fluid > .span11 {
width: 91.489361693%; width: 91.489361693%;
} }
.row-fluid .span12 { .row-fluid > .span12 {
width: 99.99999998999999%; width: 99.99999998999999%;
} }
.container { .container {

116
docs/scaffolding.html
View file

@ -81,7 +81,9 @@
<p class="lead">Bootstrap is built on a responsive 12-column grid. We've also included fixed- and fluid-width layouts based on that system.</p> <p class="lead">Bootstrap is built on a responsive 12-column grid. We've also included fixed- and fluid-width layouts based on that system.</p>
<div class="subnav"> <div class="subnav">
<ul class="nav nav-pills"> <ul class="nav nav-pills">
<li><a href="#grid-system">Grid system</a></li> <li><a href="#gridSystem">Grid system</a></li>
<li><a href="#fluidGridSystem">Fluid gird system</a></li>
<li><a href="#gridCustomization">Customizing</a></li>
<li><a href="#layouts">Layouts</a></li> <li><a href="#layouts">Layouts</a></li>
<li><a href="#responsive">Responsive design</a></li> <li><a href="#responsive">Responsive design</a></li>
</ul> </ul>
@ -92,12 +94,11 @@
<!-- Grid system <!-- Grid system
================================================== --> ================================================== -->
<section id="grid-system"> <section id="gridSystem">
<div class="page-header"> <div class="page-header">
<h1>Grid system <small>12 columns with a responsive twist</small></h1> <h1>Default grid system <small>12 columns with a responsive twist</small></h1>
</div> </div>
<h2>Default grid</h2>
<div class="row show-grid"> <div class="row show-grid">
<div class="span1">1</div> <div class="span1">1</div>
<div class="span1">1</div> <div class="span1">1</div>
@ -188,7 +189,87 @@
</div> </div>
</div> </div>
</div> </div>
<h3>Fluid example</h3> </div><!-- /span6 -->
<div class="span6">
<pre class="prettyprint linenums">
&lt;div class="row"&gt;
&lt;div class="span12"&gt;
Level 1 of column
&lt;div class="row"&gt;
&lt;div class="span6"&gt;Level 2&lt;/div&gt;
&lt;div class="span6"&gt;Level 2&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
</pre>
</div>
</div>
</section>
<!-- Fluid grid system
================================================== -->
<section id="fluidGridSystem">
<div class="page-header">
<h1>Fluid grid system <small>12 responsive, percent-based columns</small></h1>
</div>
<h2>Fluid columns</h2>
<div class="row-fluid show-grid">
<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 class="row-fluid show-grid">
<div class="span4">4</div>
<div class="span4">4</div>
<div class="span4">4</div>
</div>
<div class="row-fluid show-grid">
<div class="span4">4</div>
<div class="span8">8</div>
</div>
<div class="row-fluid show-grid">
<div class="span6">6</div>
<div class="span6">6</div>
</div>
<div class="row-fluid show-grid">
<div class="span12">12</div>
</div>
<div class="row">
<div class="span4">
<h3>Percents, not pixels</h3>
<p>The fluid grid system uses percents for column widths instead of fixed pixels. It also has the same responsive variations as our fixed grid system, ensuring proper proportions for key screen resolutions and devices.</p>
</div>
<div class="span4">
<h3>Fluid rows</h3>
<p>Make any row fluid simply by changing <code>.row</code> to <code>.row-fluid</code>. The columns stay the exact same, making it super straightforward to flip between fixed and fluid layouts.</p>
</div>
<div class="span4">
<h3>Markup</h3>
<pre class="prettyprint linenums">
&lt;div class="row-fluid"&gt;
&lt;div class="span4"&gt;...&lt;/div&gt;
&lt;div class="span8"&gt;...&lt;/div&gt;
&lt;/div&gt;
</pre>
</div>
</div><!-- /row -->
<h2>Fluid nesting</h2>
<div class="row">
<div class="span6">
<p>Nesting with fluid grids is a bit different: the number of nested columns doesn't need to match the parent. Instead, your columns are reset at each level because each row takes up 100% of the parent column.</p> <p>Nesting with fluid grids is a bit different: the number of nested columns doesn't need to match the parent. Instead, your columns are reset at each level because each row takes up 100% of the parent column.</p>
<div class="row-fluid show-grid"> <div class="row-fluid show-grid">
<div class="span12"> <div class="span12">
@ -206,10 +287,10 @@
</div> </div>
<div class="span6"> <div class="span6">
<pre class="prettyprint linenums"> <pre class="prettyprint linenums">
&lt;div class="row"&gt; &lt;div class="row-fluid"&gt;
&lt;div class="span12"&gt; &lt;div class="span12"&gt;
Level 1 of column Level 1 of column
&lt;div class="row"&gt; &lt;div class="row-fluid"&gt;
&lt;div class="span6"&gt;Level 2&lt;/div&gt; &lt;div class="span6"&gt;Level 2&lt;/div&gt;
&lt;div class="span6"&gt;Level 2&lt;/div&gt; &lt;div class="span6"&gt;Level 2&lt;/div&gt;
&lt;/div&gt; &lt;/div&gt;
@ -219,7 +300,16 @@
</div> </div>
</div> </div>
<h2>Grid customization</h2> </section>
<!-- Customizaton
================================================== -->
<section id="gridCustomization">
<div class="page-header">
<h1>Grid customization</h1>
</div>
<table class="table table-bordered table-striped"> <table class="table table-bordered table-striped">
<thead> <thead>
<tr> <tr>
@ -281,8 +371,8 @@
<div class="span6"> <div class="span6">
<h2>Fixed layout</h2> <h2>Fixed layout</h2>
<p>The default and simple 940px-wide, centered layout for just about any website or page provided by a single <code>&lt;div class="container"&gt;</code>.</p> <p>The default and simple 940px-wide, centered layout for just about any website or page provided by a single <code>&lt;div class="container"&gt;</code>.</p>
<div class="minicon-layout"> <div class="mini-layout">
<div class="minicon-layout-body"></div> <div class="mini-layout-body"></div>
</div> </div>
<pre class="prettyprint linenums"> <pre class="prettyprint linenums">
&lt;body&gt; &lt;body&gt;
@ -295,9 +385,9 @@
<div class="span6"> <div class="span6">
<h2>Fluid layout</h2> <h2>Fluid layout</h2>
<p><code>&lt;div class="container-fluid"&gt;</code> gives flexible page structure, min- and max-widths, and a left-hand sidebar. It's great for apps and docs.</p> <p><code>&lt;div class="container-fluid"&gt;</code> gives flexible page structure, min- and max-widths, and a left-hand sidebar. It's great for apps and docs.</p>
<div class="minicon-layout fluid"> <div class="mini-layout fluid">
<div class="minicon-layout-sidebar"></div> <div class="mini-layout-sidebar"></div>
<div class="minicon-layout-body"></div> <div class="mini-layout-body"></div>
</div> </div>
<pre class="prettyprint linenums"> <pre class="prettyprint linenums">
&lt;div class="container-fluid"&gt; &lt;div class="container-fluid"&gt;

116
docs/templates/pages/scaffolding.mustache vendored
View file

@ -5,7 +5,9 @@
<p class="lead">{{_i}}Bootstrap is built on a responsive 12-column grid. We've also included fixed- and fluid-width layouts based on that system.{{/i}}</p> <p class="lead">{{_i}}Bootstrap is built on a responsive 12-column grid. We've also included fixed- and fluid-width layouts based on that system.{{/i}}</p>
<div class="subnav"> <div class="subnav">
<ul class="nav nav-pills"> <ul class="nav nav-pills">
<li><a href="#grid-system">{{_i}}Grid system{{/i}}</a></li> <li><a href="#gridSystem">{{_i}}Grid system{{/i}}</a></li>
<li><a href="#fluidGridSystem">{{_i}}Fluid gird system{{/i}}</a></li>
<li><a href="#gridCustomization">{{_i}}Customizing{{/i}}</a></li>
<li><a href="#layouts">{{_i}}Layouts{{/i}}</a></li> <li><a href="#layouts">{{_i}}Layouts{{/i}}</a></li>
<li><a href="#responsive">{{_i}}Responsive design{{/i}}</a></li> <li><a href="#responsive">{{_i}}Responsive design{{/i}}</a></li>
</ul> </ul>
@ -16,12 +18,11 @@
<!-- Grid system <!-- Grid system
================================================== --> ================================================== -->
<section id="grid-system"> <section id="gridSystem">
<div class="page-header"> <div class="page-header">
<h1>{{_i}}Grid system <small>12 columns with a responsive twist</small>{{/i}}</h1> <h1>{{_i}}Default grid system <small>12 columns with a responsive twist</small>{{/i}}</h1>
</div> </div>
<h2>{{_i}}Default grid{{/i}}</h2>
<div class="row show-grid"> <div class="row show-grid">
<div class="span1">1</div> <div class="span1">1</div>
<div class="span1">1</div> <div class="span1">1</div>
@ -112,7 +113,87 @@
</div> </div>
</div> </div>
</div> </div>
<h3>{{_i}}Fluid example{{/i}}</h3> </div><!-- /span6 -->
<div class="span6">
<pre class="prettyprint linenums">
&lt;div class="row"&gt;
&lt;div class="span12"&gt;
{{_i}}Level 1 of column{{/i}}
&lt;div class="row"&gt;
&lt;div class="span6"&gt;{{_i}}Level 2{{/i}}&lt;/div&gt;
&lt;div class="span6"&gt;{{_i}}Level 2{{/i}}&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
</pre>
</div>
</div>
</section>
<!-- Fluid grid system
================================================== -->
<section id="fluidGridSystem">
<div class="page-header">
<h1>{{_i}}Fluid grid system <small>12 responsive, percent-based columns</small>{{/i}}</h1>
</div>
<h2>{{_i}}Fluid columns{{/i}}</h2>
<div class="row-fluid show-grid">
<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 class="row-fluid show-grid">
<div class="span4">4</div>
<div class="span4">4</div>
<div class="span4">4</div>
</div>
<div class="row-fluid show-grid">
<div class="span4">4</div>
<div class="span8">8</div>
</div>
<div class="row-fluid show-grid">
<div class="span6">6</div>
<div class="span6">6</div>
</div>
<div class="row-fluid show-grid">
<div class="span12">12</div>
</div>
<div class="row">
<div class="span4">
<h3>{{_i}}Percents, not pixels{{/i}}</h3>
<p>{{_i}}The fluid grid system uses percents for column widths instead of fixed pixels. It also has the same responsive variations as our fixed grid system, ensuring proper proportions for key screen resolutions and devices.{{/i}}</p>
</div>
<div class="span4">
<h3>{{_i}}Fluid rows{{/i}}</h3>
<p>{{_i}}Make any row fluid simply by changing <code>.row</code> to <code>.row-fluid</code>. The columns stay the exact same, making it super straightforward to flip between fixed and fluid layouts.{{/i}}</p>
</div>
<div class="span4">
<h3>{{_i}}Markup{{/i}}</h3>
<pre class="prettyprint linenums">
&lt;div class="row-fluid"&gt;
&lt;div class="span4"&gt;...&lt;/div&gt;
&lt;div class="span8"&gt;...&lt;/div&gt;
&lt;/div&gt;
</pre>
</div>
</div><!-- /row -->
<h2>{{_i}}Fluid nesting{{/i}}</h2>
<div class="row">
<div class="span6">
<p>{{_i}}Nesting with fluid grids is a bit different: the number of nested columns doesn't need to match the parent. Instead, your columns are reset at each level because each row takes up 100% of the parent column.{{/i}}</p> <p>{{_i}}Nesting with fluid grids is a bit different: the number of nested columns doesn't need to match the parent. Instead, your columns are reset at each level because each row takes up 100% of the parent column.{{/i}}</p>
<div class="row-fluid show-grid"> <div class="row-fluid show-grid">
<div class="span12"> <div class="span12">
@ -130,10 +211,10 @@
</div> </div>
<div class="span6"> <div class="span6">
<pre class="prettyprint linenums"> <pre class="prettyprint linenums">
&lt;div class="row"&gt; &lt;div class="row-fluid"&gt;
&lt;div class="span12"&gt; &lt;div class="span12"&gt;
{{_i}}Level 1 of column{{/i}} {{_i}}Level 1 of column{{/i}}
&lt;div class="row"&gt; &lt;div class="row-fluid"&gt;
&lt;div class="span6"&gt;{{_i}}Level 2{{/i}}&lt;/div&gt; &lt;div class="span6"&gt;{{_i}}Level 2{{/i}}&lt;/div&gt;
&lt;div class="span6"&gt;{{_i}}Level 2{{/i}}&lt;/div&gt; &lt;div class="span6"&gt;{{_i}}Level 2{{/i}}&lt;/div&gt;
&lt;/div&gt; &lt;/div&gt;
@ -143,7 +224,16 @@
</div> </div>
</div> </div>
<h2>{{_i}}Grid customization{{/i}}</h2> </section>
<!-- Customizaton
================================================== -->
<section id="gridCustomization">
<div class="page-header">
<h1>{{_i}}Grid customization{{/i}}</h1>
</div>
<table class="table table-bordered table-striped"> <table class="table table-bordered table-striped">
<thead> <thead>
<tr> <tr>
@ -205,8 +295,8 @@
<div class="span6"> <div class="span6">
<h2>{{_i}}Fixed layout{{/i}}</h2> <h2>{{_i}}Fixed layout{{/i}}</h2>
<p>{{_i}}The default and simple 940px-wide, centered layout for just about any website or page provided by a single <code>&lt;div class="container"&gt;</code>.{{/i}}</p> <p>{{_i}}The default and simple 940px-wide, centered layout for just about any website or page provided by a single <code>&lt;div class="container"&gt;</code>.{{/i}}</p>
<div class="minicon-layout"> <div class="mini-layout">
<div class="minicon-layout-body"></div> <div class="mini-layout-body"></div>
</div> </div>
<pre class="prettyprint linenums"> <pre class="prettyprint linenums">
&lt;body&gt; &lt;body&gt;
@ -219,9 +309,9 @@
<div class="span6"> <div class="span6">
<h2>{{_i}}Fluid layout{{/i}}</h2> <h2>{{_i}}Fluid layout{{/i}}</h2>
<p>{{_i}}<code>&lt;div class="container-fluid"&gt;</code> gives flexible page structure, min- and max-widths, and a left-hand sidebar. It's great for apps and docs.{{/i}}</p> <p>{{_i}}<code>&lt;div class="container-fluid"&gt;</code> gives flexible page structure, min- and max-widths, and a left-hand sidebar. It's great for apps and docs.{{/i}}</p>
<div class="minicon-layout fluid"> <div class="mini-layout fluid">
<div class="minicon-layout-sidebar"></div> <div class="mini-layout-sidebar"></div>
<div class="minicon-layout-body"></div> <div class="mini-layout-body"></div>
</div> </div>
<pre class="prettyprint linenums"> <pre class="prettyprint linenums">
&lt;div class="container-fluid"&gt; &lt;div class="container-fluid"&gt;

28
less/mixins.less
View file

@ -208,13 +208,13 @@
// Setup the mixins to be used // Setup the mixins to be used
.columns(@fluidGridGutterWidth, @fluidGridColumnWidth, @columns) { .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, @columns) {
width: 1% * (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)); width: 1% * (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1));
} }
.gridColumn(@fluidGridGutterWidth) { .gridColumn(@fluidGridGutterWidth) {
float: left; float: left;
margin-left: @fluidGridGutterWidth; margin-left: @fluidGridGutterWidth;
} }
// Take these values and mixins, and make 'em do their thang // Take these values and mixins, and make 'em do their thang
.generate(@gridColumns, @fluidGridColumnWidth, @fluidGridGutterWidth) { .generate(@gridColumns, @fluidGridColumnWidth, @fluidGridGutterWidth) {
// Row surrounds the columns // Row surrounds the columns
.row-fluid { .row-fluid {
width: 100%; width: 100%;
@ -228,18 +228,18 @@
margin-left: 0; margin-left: 0;
} }
// Default columns // Default columns
.span1 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 1); } > .span1 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 1); }
.span2 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 2); } > .span2 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 2); }
.span3 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 3); } > .span3 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 3); }
.span4 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 4); } > .span4 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 4); }
.span5 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 5); } > .span5 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 5); }
.span6 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 6); } > .span6 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 6); }
.span7 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 7); } > .span7 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 7); }
.span8 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 8); } > .span8 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 8); }
.span9 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 9); } > .span9 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 9); }
.span10 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 10); } > .span10 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 10); }
.span11 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 11); } > .span11 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 11); }
.span12 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 12); } > .span12 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 12); }
} }
} }
} }