mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-14 18:42:30 +03:00
Code Activity

add .btn-block for a full-width button option

Browse Source
This commit is contained in:
Mark Otto
2012-07-27 15:42:58 -07:00
parent 16b4ac0d8f
commit fe6a4b0b54
4 changed files with 71 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/templates/pages/base-css.mustache
Vendored
+26 -21
View File
@@ -1376,26 +1376,34 @@
<p>{{_i}}IE9 doesn't crop background gradients on rounded corners, so we remove it. Related, IE9 jankifies disabled <code>button</code> elements, rendering text gray with a nasty text-shadow that we cannot fix.{{/i}}</p>
<hr class="bs-docs-separator">
<h2>{{_i}}Button sizes{{/i}}</h2>
<p>{{_i}}Fancy larger or smaller buttons? Add <code>.btn-large</code>, <code>.btn-small</code>, or <code>.btn-mini</code> for two additional sizes.{{/i}}</p>
<p>
<button type="button" class="btn btn-large btn-primary">{{_i}}Primary action{{/i}}</button>
<button type="button" class="btn btn-large">{{_i}}Action{{/i}}</button>
</p>
<p>
<button type="button" class="btn btn-small btn-primary">{{_i}}Primary action{{/i}}</button>
<button type="button" class="btn btn-small">{{_i}}Action{{/i}}</button>
</p>
<p>
<button type="button" class="btn btn-mini btn-primary">{{_i}}Primary action{{/i}}</button>
<button type="button" class="btn btn-mini">{{_i}}Action{{/i}}</button>
</p>
<hr class="bs-docs-separator">
<div class="bs-docs-example">
<p>
<button type="button" class="btn btn-large btn-primary">{{_i}}Primary action{{/i}}</button>
<button type="button" class="btn btn-large">{{_i}}Action{{/i}}</button>
</p>
<p>
<button type="button" class="btn btn-small btn-primary">{{_i}}Primary action{{/i}}</button>
<button type="button" class="btn btn-small">{{_i}}Action{{/i}}</button>
</p>
<p>
<button type="button" class="btn btn-mini btn-primary">{{_i}}Primary action{{/i}}</button>
<button type="button" class="btn btn-mini">{{_i}}Action{{/i}}</button>
</p>
</div>
<pre class="prettyprint linenums">
&lt;button class="btn btn-large" type="button"&gt;{{_i}}Large button{{/i}}&lt;/button&gt;
&lt;button class="btn btn-small" type="button"&gt;{{_i}}Small button{{/i}}&lt;/button&gt;
&lt;button class="btn btn-mini" type="button"&gt;{{_i}}Mini button{{/i}}&lt;/button&gt;
</pre>
<p>{{_i}}Create block level buttons&mdash;those that span the full width of a parent&mdash; by adding <code>.btn-block</code>.{{/i}}</p>
<div class="bs-docs-example">
<div class="well" style="max-width: 400px; margin: 0 auto;">
<button type="button" class="btn btn-large btn-block">{{_i}}Block level button{{/i}}</button>
</div>
</div>
<pre class="prettyprint linenums">&lt;button class="btn btn-large btn-block" type="button"&gt;{{_i}}Block level button{{/i}}&lt;/button&gt;</pre>
<h2>{{_i}}Disabled state{{/i}}</h2>
@@ -1428,9 +1436,6 @@
</pre>
<hr class="bs-docs-separator">
<h2>{{_i}}One class, multiple tags{{/i}}</h2>
<p>{{_i}}Use the <code>.btn</code> class on an <code>&lt;a&gt;</code>, <code>&lt;button&gt;</code>, or <code>&lt;input&gt;</code> element.{{/i}}</p>
<form class="bs-docs-example">