Remove .controls-row; instead, folks should use .row and .span* for all their grid input sizing needs when multiple inputs per line are required

3 files changed, 2 insertions, 169 deletions

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index b4e548870..a1af172b2 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -1088,90 +1088,6 @@ textarea[class*="span"],
   margin-left: 0;
 }
 
-.controls-row input.offset12,
-textarea.offset12,
-select.offset12,
-uneditable-input.offset12 {
-  margin-left: 101.06382978723404%;
-}
-
-.controls-row input.offset11,
-textarea.offset11,
-select.offset11,
-uneditable-input.offset11 {
-  margin-left: 92.7304964539007%;
-}
-
-.controls-row input.offset10,
-textarea.offset10,
-select.offset10,
-uneditable-input.offset10 {
-  margin-left: 84.39716312056738%;
-}
-
-.controls-row input.offset9,
-textarea.offset9,
-select.offset9,
-uneditable-input.offset9 {
-  margin-left: 76.06382978723404%;
-}
-
-.controls-row input.offset8,
-textarea.offset8,
-select.offset8,
-uneditable-input.offset8 {
-  margin-left: 67.7304964539007%;
-}
-
-.controls-row input.offset7,
-textarea.offset7,
-select.offset7,
-uneditable-input.offset7 {
-  margin-left: 59.39716312056738%;
-}
-
-.controls-row input.offset6,
-textarea.offset6,
-select.offset6,
-uneditable-input.offset6 {
-  margin-left: 51.06382978723404%;
-}
-
-.controls-row input.offset5,
-textarea.offset5,
-select.offset5,
-uneditable-input.offset5 {
-  margin-left: 42.73049645390071%;
-}
-
-.controls-row input.offset4,
-textarea.offset4,
-select.offset4,
-uneditable-input.offset4 {
-  margin-left: 34.39716312056737%;
-}
-
-.controls-row input.offset3,
-textarea.offset3,
-select.offset3,
-uneditable-input.offset3 {
-  margin-left: 26.06382978723404%;
-}
-
-.controls-row input.offset2,
-textarea.offset2,
-select.offset2,
-uneditable-input.offset2 {
-  margin-left: 17.730496453900706%;
-}
-
-.controls-row input.offset1,
-textarea.offset1,
-select.offset1,
-uneditable-input.offset1 {
-  margin-left: 9.397163120567374%;
-}
-
 .input-append input[class*="span"],
 .input-append .uneditable-input[class*="span"],
 .input-prepend input[class*="span"],
@@ -1186,25 +1102,6 @@ textarea[class*="span"],
   height: 34px;
 }
 
-.controls-row:before,
-.controls-row:after {
-  display: table;
-  content: " ";
-}
-
-.controls-row:after {
-  clear: both;
-}
-
-.controls-row [class*="span"] {
-  float: left;
-}
-
-.controls-row .checkbox[class*="span"],
-.controls-row .radio[class*="span"] {
-  padding-top: 5px;
-}
-
 input[disabled],
 select[disabled],
 textarea[disabled],
diff --git a/docs/css.html b/docs/css.html
index a3133026d..db7cb17e2 100644
--- a/docs/css.html
+++ b/docs/css.html
@@ -1538,39 +1538,7 @@ For example, <code><section></code> should be wrapped
   ...
 </select>
 </pre>
-
-          <p>For multiple grid inputs per line, <strong>use the <code>.controls-row</code> modifier class for proper spacing</strong>. It floats the inputs to collapse white-space, sets the proper margins, and the clears the float.</p>
-          <form class="bs-docs-example" style="padding-bottom: 15px;">
-            <div class="controls controls-row">
-              <input class="span5" type="text" placeholder=".span5">
-            </div>
-            <div class="controls controls-row">
-              <input class="span4" type="text" placeholder=".span4">
-              <input class="span1" type="text" placeholder=".span1">
-            </div>
-            <div class="controls controls-row">
-              <input class="span3" type="text" placeholder=".span3">
-              <input class="span2" type="text" placeholder=".span2">
-            </div>
-            <div class="controls controls-row">
-              <input class="span2" type="text" placeholder=".span2">
-              <input class="span3" type="text" placeholder=".span3">
-            </div>
-            <div class="controls controls-row">
-              <input class="span1" type="text" placeholder=".span1">
-              <input class="span4" type="text" placeholder=".span4">
-            </div>
-          </form>
-<pre class="prettyprint linenums">
-&lt;div class="controls"&gt;
-  &lt;input class="span5" type="text" placeholder=".span5"&gt;
-&lt;/div&gt;
-&lt;div class="controls controls-row"&gt;
-  &lt;input class="span4" type="text" placeholder=".span4"&gt;
-  &lt;input class="span1" type="text" placeholder=".span1"&gt;
-&lt;/div&gt;
-...
-</pre>
+          <p>If you need multiple inputs on the same line, wrap them in the standard grid markup (with `.row` and `.span*` classes). Each input should have it's own column and will expand to fill the available width automatically.</p>
 
           <h3>Uneditable inputs</h3>
           <p>Present data in a form that's not editable without using actual form markup.</p>
diff --git a/docs/templates/pages/css.mustache b/docs/templates/pages/css.mustache
index 30b0e68e6..93e3e269d 100644
--- a/docs/templates/pages/css.mustache
+++ b/docs/templates/pages/css.mustache
@@ -1478,39 +1478,7 @@ For example, &lt;code&gt;&amp;lt;section&amp;gt;&lt;/code&gt; should be wrapped
   ...
 &lt;/select&gt;
 </pre>
-
-          <p>For multiple grid inputs per line, <strong>use the <code>.controls-row</code> modifier class for proper spacing</strong>. It floats the inputs to collapse white-space, sets the proper margins, and the clears the float.</p>
-          <form class="bs-docs-example" style="padding-bottom: 15px;">
-            <div class="controls controls-row">
-              <input class="span5" type="text" placeholder=".span5">
-            </div>
-            <div class="controls controls-row">
-              <input class="span4" type="text" placeholder=".span4">
-              <input class="span1" type="text" placeholder=".span1">
-            </div>
-            <div class="controls controls-row">
-              <input class="span3" type="text" placeholder=".span3">
-              <input class="span2" type="text" placeholder=".span2">
-            </div>
-            <div class="controls controls-row">
-              <input class="span2" type="text" placeholder=".span2">
-              <input class="span3" type="text" placeholder=".span3">
-            </div>
-            <div class="controls controls-row">
-              <input class="span1" type="text" placeholder=".span1">
-              <input class="span4" type="text" placeholder=".span4">
-            </div>
-          </form>
-<pre class="prettyprint linenums">
-&lt;div class="controls"&gt;
-  &lt;input class="span5" type="text" placeholder=".span5"&gt;
-&lt;/div&gt;
-&lt;div class="controls controls-row"&gt;
-  &lt;input class="span4" type="text" placeholder=".span4"&gt;
-  &lt;input class="span1" type="text" placeholder=".span1"&gt;
-&lt;/div&gt;
-...
-</pre>
+          <p>If you need multiple inputs on the same line, wrap them in the standard grid markup (with `.row` and `.span*` classes). Each input should have it's own column and will expand to fill the available width automatically.</p>
 
           <h3>Uneditable inputs</h3>
           <p>Present data in a form that's not editable without using actual form markup.</p>