aboutsummaryrefslogtreecommitdiff
path: root/docs/base-css.html
diff options
context:
space:
mode:
authorMark Otto <[email protected]>2012-09-25 22:16:47 -0700
committerMark Otto <[email protected]>2012-09-25 22:16:47 -0700
commit9e97098802d969d338fdb6c553cf6cee903c8663 (patch)
tree7ac66b68cf524b0c6c419a428af3bb007e759802 /docs/base-css.html
parent0220015edd1c06e0475a346ca5882e3b1758af48 (diff)
downloadbootstrap-9e97098802d969d338fdb6c553cf6cee903c8663.tar.xz
bootstrap-9e97098802d969d338fdb6c553cf6cee903c8663.zip
make .input-* classes match .btn-* size classes
Diffstat (limited to 'docs/base-css.html')
-rw-r--r--docs/base-css.html22
1 files changed, 7 insertions, 15 deletions
diff --git a/docs/base-css.html b/docs/base-css.html
index a2ecf613a..3c218e68f 100644
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -1336,30 +1336,22 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
<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>
+ <p>Create larger or smaller form controls that match button sizes.</p>
<form class="bs-docs-example" style="padding-bottom: 15px;">
<div class="controls docs-input-sizes">
- <input class="input-mini" type="text" placeholder=".input-mini">
- <input class="input-small" type="text" placeholder=".input-small">
- <input class="input-medium" type="text" placeholder=".input-medium">
<input class="input-large" type="text" placeholder=".input-large">
- <input class="input-xlarge" type="text" placeholder=".input-xlarge">
- <input class="input-xxlarge" type="text" placeholder=".input-xxlarge">
+ <input class="input-small" type="text" placeholder=".input-small">
+ <input class="input-mini" type="text" placeholder=".input-mini">
</div>
</form>
<pre class="prettyprint linenums">
-&lt;input class="input-mini" type="text" placeholder=".input-mini"&gt;
-&lt;input class="input-small" type="text" placeholder=".input-small"&gt;
-&lt;input class="input-medium" type="text" placeholder=".input-medium"&gt;
&lt;input class="input-large" type="text" placeholder=".input-large"&gt;
-&lt;input class="input-xlarge" type="text" placeholder=".input-xlarge"&gt;
-&lt;input class="input-xxlarge" type="text" placeholder=".input-xxlarge"&gt;
+&lt;input class="input-small" type="text" placeholder=".input-small"&gt;
+&lt;input class="input-mini" type="text" placeholder=".input-mini"&gt;
</pre>
- <p>
- <span class="label label-info">Heads up!</span> In future versions, we'll be altering the use of these relative input classes to match our button sizes. For example, <code>.input-large</code> will increase the padding and font-size of an input.
- </p>
- <h4>Grid sizing</h4>
- <p>Use <code>.span1</code> to <code>.span12</code> for inputs that match the same sizes of the grid columns.</p>
+ <h4>Column sizing</h4>
+ <p>Use <code>.span1</code> to <code>.span12</code> for setting widths on inputs that match Bootstrap's grid system.</p>
<form class="bs-docs-example" style="padding-bottom: 15px;">
<div class="controls docs-input-sizes">
<input class="span1" type="text" placeholder=".span1">