commenting out stuff and adding grid test page

5 files changed, 107 insertions, 14 deletions

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index f53a3b458..3ac976ea2 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -980,8 +980,8 @@ textarea[class*="span"],
 .row-fluid select[class*="span"],
 .row-fluid textarea[class*="span"],
 .row-fluid .uneditable-input[class*="span"] {
-  float: none;
-  margin-left: 0;
+  xmargin-left: 0;
+  xfloat: none;
 }
 
 .input-append input[class*="span"],
diff --git a/docs/base-css.html b/docs/base-css.html
index 7504f2469..b87c27829 100644
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -872,7 +872,7 @@ For example, <code><section></code> should be wrapped as inlin
             <h1>Forms</h1>
           </div>
 
-          <h2>Default styles</h2>
+          <h2 id="forms-default">Default styles</h2>
           <p>Individual form controls receive styling, but without any required base class on the <code>&lt;form&gt;</code> or large changes in markup. Results in stacked, left-aligned labels on top of form controls.</p>
           <form class="bs-docs-example">
             <legend>Legend</legend>
@@ -901,7 +901,7 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
           <hr class="bs-docs-separator">
 
 
-          <h2>Optional layouts</h2>
+          <h2 id="forms-layouts">Optional layouts</h2>
           <p>Included with Bootstrap are three optional form layouts for common use cases.</p>
 
           <h3>Search form</h3>
@@ -998,7 +998,7 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
           <hr class="bs-docs-separator">
 
 
-          <h2>Supported form controls</h2>
+          <h2 id="forms-controls">Supported form controls</h2>
           <p>Examples of standard form controls supported in an example form layout.</p>
 
           <h3>Inputs</h3>
@@ -1120,7 +1120,7 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
           <hr class="bs-docs-separator">
 
 
-          <h2>Extending form controls</h2>
+          <h2 id="forms-extending">Extending form controls</h2>
           <p>Adding on top of existing browser controls, Bootstrap includes other useful form components.</p>
 
           <h3>Prepended and appended inputs</h3>
@@ -1211,7 +1211,7 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
 &lt;/form&gt;
 </pre>
 
-          <h3>Control sizing</h3>
+          <h3 id="forms-extending-sizes">Control sizing</h3>
           <p>Use relative sizing classes like <code>.input-large</code> or match your inputs to the grid column sizes using <code>.span*</code> classes.</p>
 
           <h4>Relative sizing</h4>
diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache
index cc83e0d73..c242fef50 100644
--- a/docs/templates/pages/base-css.mustache
+++ b/docs/templates/pages/base-css.mustache
@@ -809,7 +809,7 @@
             <h1>{{_i}}Forms{{/i}}</h1>
           </div>
 
-          <h2>{{_i}}Default styles{{/i}}</h2>
+          <h2 id="forms-default">{{_i}}Default styles{{/i}}</h2>
           <p>{{_i}}Individual form controls receive styling, but without any required base class on the <code>&lt;form&gt;</code> or large changes in markup. Results in stacked, left-aligned labels on top of form controls.{{/i}}</p>
           <form class="bs-docs-example">
             <legend>Legend</legend>
@@ -838,7 +838,7 @@
           <hr class="bs-docs-separator">
 
 
-          <h2>{{_i}}Optional layouts{{/i}}</h2>
+          <h2 id="forms-layouts">{{_i}}Optional layouts{{/i}}</h2>
           <p>{{_i}}Included with Bootstrap are three optional form layouts for common use cases.{{/i}}</p>
 
           <h3>{{_i}}Search form{{/i}}</h3>
@@ -935,7 +935,7 @@
           <hr class="bs-docs-separator">
 
 
-          <h2>{{_i}}Supported form controls{{/i}}</h2>
+          <h2 id="forms-controls">{{_i}}Supported form controls{{/i}}</h2>
           <p>{{_i}}Examples of standard form controls supported in an example form layout.{{/i}}</p>
 
           <h3>{{_i}}Inputs{{/i}}</h3>
@@ -1057,7 +1057,7 @@
           <hr class="bs-docs-separator">
 
 
-          <h2>{{_i}}Extending form controls{{/i}}</h2>
+          <h2 id="forms-extending">{{_i}}Extending form controls{{/i}}</h2>
           <p>{{_i}}Adding on top of existing browser controls, Bootstrap includes other useful form components.{{/i}}</p>
 
           <h3>{{_i}}Prepended and appended inputs{{/i}}</h3>
@@ -1148,7 +1148,7 @@
 &lt;/form&gt;
 </pre>
 
-          <h3>{{_i}}Control sizing{{/i}}</h3>
+          <h3 id="forms-extending-sizes">{{_i}}Control sizing{{/i}}</h3>
           <p>{{_i}}Use relative sizing classes like <code>.input-large</code> or match your inputs to the grid column sizes using <code>.span*</code> classes.{{/i}}</p>
 
           <h4>{{_i}}Relative sizing{{/i}}</h4>
diff --git a/less/forms.less b/less/forms.less
index 557f87278..afb84caee 100644
--- a/less/forms.less
+++ b/less/forms.less
@@ -275,8 +275,8 @@ textarea[class*="span"],
 .row-fluid select[class*="span"],
 .row-fluid textarea[class*="span"],
 .row-fluid .uneditable-input[class*="span"] {
-  float: none;
-  margin-left: 0;
+  xfloat: none;
+  xmargin-left: 0;
 }
 // Ensure input-prepend/append never wraps
 .input-append input[class*="span"],
diff --git a/less/tests/grid.html b/less/tests/grid.html
new file mode 100644
index 000000000..1360d3ebc
--- /dev/null
+++ b/less/tests/grid.html
@@ -0,0 +1,93 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>Bootstrap</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="">
+    <meta name="author" content="">
+
+    <!-- Le styles -->
+    <link href="../../docs/assets/css/bootstrap.css" rel="stylesheet">
+    <link href="../../docs/assets/css/bootstrap-responsive.css" rel="stylesheet">
+    <link href="../../docs/assets/css/docs.css" rel="stylesheet">
+    <style>
+      body {
+        padding-top: 30px;
+        padding-bottom: 30px;
+      }
+    </style>
+
+    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
+    <!--[if lt IE 9]>
+      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+
+    <!-- Le fav and touch icons -->
+    <link rel="shortcut icon" href="../../docs/assets/ico/favicon.ico">
+    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../../docs/assets/ico/apple-touch-icon-144-precomposed.png">
+    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../../docs/assets/ico/apple-touch-icon-114-precomposed.png">
+    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../../docs/assets/ico/apple-touch-icon-72-precomposed.png">
+    <link rel="apple-touch-icon-precomposed" href="../../docs/assets/ico/apple-touch-icon-57-precomposed.png">
+  </head>
+
+  <body>
+
+    <form class="container">
+
+      <div class="page-header">
+        <h1>Grids</h1>
+      </div>
+
+
+      <h2>Default grid columns</h2>
+      <div class="bs-docs-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>
+          <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 show-grid">
+          <div class="span4">4</div>
+          <div class="span4">4</div>
+          <div class="span4">4</div>
+        </div>
+        <div class="row show-grid">
+          <div class="span6">6</div>
+          <div class="span6">6</div>
+        </div>
+        <div class="row show-grid">
+          <div class="span12">12</div>
+        </div>
+      </div>
+
+
+
+      <h2>Inputs</h2>
+
+      <h4>No additional markup</h4>
+      <input type="text" class="span4" placeholder=".span4">
+      <input type="text" class="span4" placeholder=".span4">
+      <input type="text" class="span4" placeholder=".span4">
+
+      <h4>With .controls-row</h4>
+      <div class="controls-row">
+        <input type="text" class="span4" placeholder=".span4">
+        <input type="text" class="span4" placeholder=".span4">
+        <input type="text" class="span4" placeholder=".span4">
+      </div>
+
+
+    </form> <!-- /container -->
+
+  </body>
+</html>