From fe8061b84ecdda5ea70514fe487e2f46564439e2 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Fri, 30 Nov 2012 13:35:20 -0800 Subject: more tests for form styles; includes lightening help text --- docs/base-css.html | 36 ++++++++++++++++++++++-------------- 1 file changed, 22 insertions(+), 14 deletions(-) (limited to 'docs/base-css.html') diff --git a/docs/base-css.html b/docs/base-css.html index 8ddb107ff..c8a785fed 100644 --- a/docs/base-css.html +++ b/docs/base-css.html @@ -885,16 +885,18 @@ For example, <code><section></code> should be wrapped as inlin

Default styles

-

Individual form controls receive styling, but without any required base class on the <form> or large changes in markup. Results in stacked, left-aligned labels on top of form controls.

+

Individual form controls automatically receive some global styling. By default, inputs are set to width: 100%;.

Legend - Example block-level help text here. - +

Example block-level help text here.

+
+ +
@@ -905,9 +907,11 @@ For example, <code><section></code> should be wrapped as inlin <label>Label name</label> <input type="text" placeholder="Type something…"> <span class="help-block">Example block-level help text here.</span> - <label class="checkbox"> - <input type="checkbox"> Check me out - </label> + <div class="checkbox"> + <label> + <input type="checkbox"> Check me out + </label> + </div> <button type="submit" class="btn">Submit</button> </fieldset> </form> @@ -938,18 +942,22 @@ For example, <code><section></code> should be wrapped as inlin
- +
+ +
 <form class="form-inline">
   <input type="text" class="span3" placeholder="Email">
   <input type="password" class="span3" placeholder="Password">
-  <label class="checkbox">
-    <input type="checkbox"> Remember me
-  </label>
+    <div class="checkbox">
+      <label>
+        <input type="checkbox"> Remember me
+      </label>
+    </div>
   <button type="submit" class="btn">Sign in</button>
 </form>
 
-- cgit v1.2.3