aboutsummaryrefslogtreecommitdiff
path: root/docs/base-css.html
diff options
context:
space:
mode:
authorJacob Thornton <[email protected]>2012-01-29 13:16:02 -0800
committerJacob Thornton <[email protected]>2012-01-29 13:16:02 -0800
commit910e78d26ad476d11331e8bb9b0233e0b2ba21e3 (patch)
tree89c22731c23c1808bf92db1ceb670ca2cd3c7677 /docs/base-css.html
parent49d565a6da38359a776f83f31a1f1ccd658c88a7 (diff)
parent9fa8bde44d9bb6f26b16c7633a01bbe5ce7b20a4 (diff)
downloadbootstrap-910e78d26ad476d11331e8bb9b0233e0b2ba21e3.tar.xz
bootstrap-910e78d26ad476d11331e8bb9b0233e0b2ba21e3.zip
Merge branch '2.0-wip' of https://github.com/twitter/bootstrap into 2.0-wip
Diffstat (limited to 'docs/base-css.html')
-rw-r--r--docs/base-css.html63
1 files changed, 30 insertions, 33 deletions
diff --git a/docs/base-css.html b/docs/base-css.html
index c68391261..0b2c4547e 100644
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -952,22 +952,20 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
</form>
</div>
<div class="span4">
- <div class="form-docs">
- <h3>What's included</h3>
- <p>Shown on the left are all the default form controls we support. Here's the bulleted list:</p>
- <ul>
- <li>text inputs (text, password, email, etc)</li>
- <li>checkbox</li>
- <li>radio</li>
- <li>select</li>
- <li>multiple select</li>
- <li>file input</li>
- <li>textarea</li>
- </ul>
- <hr>
- <h3>New defaults with v2.0</h3>
- <p>Up to v1.4, Bootstrap's default form styles used the horizontal layout. With Bootstrap 2, we removed that constraint to have smarter, more scalable defaults for any form.</p>
- </div>
+ <h3>What's included</h3>
+ <p>Shown on the left are all the default form controls we support. Here's the bulleted list:</p>
+ <ul>
+ <li>text inputs (text, password, email, etc)</li>
+ <li>checkbox</li>
+ <li>radio</li>
+ <li>select</li>
+ <li>multiple select</li>
+ <li>file input</li>
+ <li>textarea</li>
+ </ul>
+ <hr>
+ <h3>New defaults with v2.0</h3>
+ <p>Up to v1.4, Bootstrap's default form styles used the horizontal layout. With Bootstrap 2, we removed that constraint to have smarter, more scalable defaults for any form.</p>
</div>
</div>
@@ -1047,19 +1045,17 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
</form>
</div>
<div class="span4">
- <div class="form-docs">
- <h3>Redesigned browser states</h3>
- <p>Bootstrap features styles for browser-supported focused and <code>disabled</code> states. We remove the default Webkit <code>outline</code> and apply a <code>box-shadow</code> in it's place for <code>:focus</code>.</p>
- <hr>
- <h3>Form validation</h3>
- <p>It also includes validation styles for errors, warnings, and success. To use, add the a class to the surrounding <code>.control-group</code>.</p>
+ <h3>Redesigned browser states</h3>
+ <p>Bootstrap features styles for browser-supported focused and <code>disabled</code> states. We remove the default Webkit <code>outline</code> and apply a <code>box-shadow</code> in it's place for <code>:focus</code>.</p>
+ <hr>
+ <h3>Form validation</h3>
+ <p>It also includes validation styles for errors, warnings, and success. To use, add the a class to the surrounding <code>.control-group</code>.</p>
<pre class="prettyprint linenums">
&lt;fieldset
class="control-group error"&gt;
&lt;/fieldset&gt;
</pre>
- </div>
</div>
</div>
@@ -1152,14 +1148,15 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
</form>
</div>
<div class="span4">
- <div class="form-docs">
- <h3>Prepend &amp; append inputs</h3>
- <p>Input groups&mdash;with appended or prepended text&mdash;provide an easy way to give more context for your inputs. Great examples include the @ sign for Twitter usernames or $ for finances.</p>
- <hr>
- <h3>Checkboxes and radios</h3>
- <p>Up to v1.4, Bootstrap required extra markup around checkboxes and radios to stack them. Now, it's a simple matter of repeating the <code>&lt;label class="checkbox"&gt;</code> that wraps the <code>&lt;input type="checkbox"&gt;</code>.</p>
- <p>Inline checkboxes and radios are also supported. Just add <code>.inline</code> to any <code>.checkbox</code> or <code>.radio</code> and you're done.</p>
- </div>
+ <h3>Prepend &amp; append inputs</h3>
+ <p>Input groups&mdash;with appended or prepended text&mdash;provide an easy way to give more context for your inputs. Great examples include the @ sign for Twitter usernames or $ for finances.</p>
+ <hr>
+ <h3>Checkboxes and radios</h3>
+ <p>Up to v1.4, Bootstrap required extra markup around checkboxes and radios to stack them. Now, it's a simple matter of repeating the <code>&lt;label class="checkbox"&gt;</code> that wraps the <code>&lt;input type="checkbox"&gt;</code>.</p>
+ <p>Inline checkboxes and radios are also supported. Just add <code>.inline</code> to any <code>.checkbox</code> or <code>.radio</code> and you're done.</p>
+ <hr>
+ <h4>Inline forms and append/prepend</h4>
+ <p>To use prepend or append inputs in an inline form, be sure to place the <code>.add-on</code> and <code>input</code> on the same line, without spaces.</p>
</div>
</div><!-- /row -->
</section>
@@ -1410,7 +1407,7 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
</div>
</div>
<div class="alert alert-info">
- <strong>Heads up!</strong> Icon classes are echoed via CSS <code>:after</code> and on hover in the docs we show a light red background color show the icon's size.
+ <strong>Heads up!</strong> Icon classes are echoed via CSS <code>:after</code>. In the docs, we show a light red background color on hover to hightlight the icon's size.
</div>
<br>
@@ -1497,7 +1494,7 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
<div class="controls">
<div class="input-prepend">
<span class="add-on"><i class="icon envelope"></i></span>
- <input class="span32" id="iconInput" size="16" type="text">
+ <input class="span2" id="iconInput" type="text">
</div>
</div>
</div>