fix forms examples and allow for inputs in labels

bootstrap.css

@@ -6,7 +6,7 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  *
  * Designed and built with all the love in the world @twitter by @mdo and @fat.
- * Date: Wed Jan 25 20:31:53 PST 2012
+ * Date: Wed Jan 25 21:28:14 PST 2012
  */
 article,
 aside,
@@ -511,6 +511,9 @@ select,
   width: auto;
   height: auto;
 }
+label input, label textarea, label select {
+  display: block;
+}
 input[type=image], input[type=checkbox], input[type=radio] {
   width: auto;
   height: auto;
@@ -893,6 +896,9 @@ input:focus:required:invalid:focus, textarea:focus:required:invalid:focus, selec
 .control-group {
   margin-bottom: 9px;
 }
+.form-horizontal legend + .control-group {
+  padding-top: 27px;
+}
 .form-horizontal .control-group {
   margin-bottom: 18px;
 }

bootstrap.min.css

@@ -96,6 +96,7 @@ label,input,button,select,textarea{font-family:"Helvetica Neue",Helvetica,Arial,
 label{display:block;margin-bottom:5px;color:#333333;}
 input,textarea,select,.uneditable-input{display:inline-block;width:210px;height:18px;padding:4px;margin-bottom:9px;font-size:13px;line-height:18px;color:#555555;border:1px solid #ccc;-webkit-border-radius:3px;border-radius:3px;}
 .uneditable-textarea{width:auto;height:auto;}
+label input,label textarea,label select{display:block;}
 input[type=image],input[type=checkbox],input[type=radio]{width:auto;height:auto;padding:0;margin:3px 0;*margin-top:0;line-height:normal;border:none;cursor:pointer;}
 input[type=file]{padding:initial;line-height:initial;border:initial;background-color:#ffffff;background-color:initial;-webkit-box-shadow:none;box-shadow:none;}
 input[type=button],input[type=reset],input[type=submit]{width:auto;height:auto;}
@@ -174,6 +175,7 @@ input:focus:required:invalid,textarea:focus:required:invalid,select:focus:requir
 .form-search input,.form-inline input,.form-horizontal input,.form-search textarea,.form-inline textarea,.form-horizontal textarea,.form-search select,.form-inline select,.form-horizontal select,.form-search .uneditable-input,.form-inline .uneditable-input,.form-horizontal .uneditable-input{display:inline-block;margin-bottom:0;}
 .form-search label,.form-inline label{display:inline-block;}
 .control-group{margin-bottom:9px;}
+.form-horizontal legend+.control-group{padding-top:27px;}
 .form-horizontal .control-group{margin-bottom:18px;}
 .form-horizontal .control-group>label{float:left;width:140px;padding-top:5px;text-align:right;}
 .form-horizontal .controls{margin-left:160px;}

docs/base-css.html

@@ -939,6 +939,7 @@
   <div class="row">
     <div class="span8">
       <form class="form-horizontal">
+        <fieldset>
           <legend>Controls Bootstrap supports</legend>
           <div class="control-group">
             <label class="control-label" for="input01">Text input</label>
@@ -996,6 +997,7 @@
             <button type="submit" class="btn primary">Save changes</button>
             <button type="reset" class="btn">Cancel</button>
           </div>
+        </fieldset>
       </form>
     </div>
     <div class="span4">

docs/templates/pages/base-css.mustache

@@ -875,6 +875,7 @@
   <div class="row">
     <div class="span8">
       <form class="form-horizontal">
+        <fieldset>
           <legend>{{_i}}Controls Bootstrap supports{{/i}}</legend>
           <div class="control-group">
             <label class="control-label" for="input01">{{_i}}Text input{{/i}}</label>
@@ -932,6 +933,7 @@
             <button type="submit" class="btn primary">{{_i}}Save changes{{/i}}</button>
             <button type="reset" class="btn">{{_i}}Cancel{{/i}}</button>
           </div>
+        </fieldset>
       </form>
     </div>
     <div class="span4">

lib/forms.less

@@ -68,6 +68,13 @@ select,
   height: auto;
 }
 
+// Inputs within a label
+label input,
+label textarea,
+label select {
+  display: block;
+}
+
 // Mini reset for unique input types
 input[type=image],
 input[type=checkbox],
@@ -474,6 +481,10 @@ select:focus:required:invalid {
 // --------------------------
 
 .form-horizontal {
+  // Legend collapses margin, so we're relegated to padding
+  legend + .control-group {
+    padding-top: @baseLineHeight * 1.5;
+  }
   // Increase spacing between groups
   .control-group {
     margin-bottom: @baseLineHeight;