aboutsummaryrefslogtreecommitdiff
path: root/docs/_includes
diff options
context:
space:
mode:
authorChris Rebert <[email protected]>2014-04-02 19:55:05 -0700
committerChris Rebert <[email protected]>2014-04-02 20:00:52 -0700
commit2d1d5754f781f0f3fa1bc296c9e69da416043c4a (patch)
tree07dcde3e24e1afb1bc7449e018e01b7bb804b16a /docs/_includes
parent640923eb36890eb194799beeb8ec3555e2b379cc (diff)
downloadbootstrap-2d1d5754f781f0f3fa1bc296c9e69da416043c4a.tar.xz
bootstrap-2d1d5754f781f0f3fa1bc296c9e69da416043c4a.zip
document that you have to add .active yourself on prechecked btn-ized checkboxes+radios; fixes #12651
Diffstat (limited to 'docs/_includes')
-rw-r--r--docs/_includes/js/buttons.html24
1 files changed, 16 insertions, 8 deletions
diff --git a/docs/_includes/js/buttons.html b/docs/_includes/js/buttons.html
index 5af374228..154320e48 100644
--- a/docs/_includes/js/buttons.html
+++ b/docs/_includes/js/buttons.html
@@ -37,10 +37,14 @@
<h4>Checkbox</h4>
<p>Add <code>data-toggle="buttons"</code> to a group of checkboxes for checkbox style toggling on btn-group.</p>
+ <div class="bs-callout bs-callout-warning">
+ <h4>Pre-checked options need <code>.active</code></h4>
+ <p>For pre-checked options, you must add the <code>.active</code> class to the input's <code>label</code> yourself.</p>
+ </div>
<div class="bs-example" style="padding-bottom: 24px;">
<div class="btn-group" data-toggle="buttons">
- <label class="btn btn-primary">
- <input type="checkbox"> Option 1
+ <label class="btn btn-primary active">
+ <input type="checkbox" checked> Option 1 (pre-checked)
</label>
<label class="btn btn-primary">
<input type="checkbox"> Option 2
@@ -52,8 +56,8 @@
</div><!-- /example -->
{% highlight html %}
<div class="btn-group" data-toggle="buttons">
- <label class="btn btn-primary">
- <input type="checkbox"> Option 1
+ <label class="btn btn-primary active">
+ <input type="checkbox" checked> Option 1 (pre-checked)
</label>
<label class="btn btn-primary">
<input type="checkbox"> Option 2
@@ -66,10 +70,14 @@
<h4>Radio</h4>
<p>Add <code>data-toggle="buttons"</code> to a group of radio inputs for radio style toggling on btn-group.</p>
+ <div class="bs-callout bs-callout-warning">
+ <h4>Preselected options need <code>.active</code></h4>
+ <p>For preselected options, you must add the <code>.active</code> class to the input's <code>label</code> yourself.</p>
+ </div>
<div class="bs-example" style="padding-bottom: 24px;">
<div class="btn-group" data-toggle="buttons">
- <label class="btn btn-primary">
- <input type="radio" name="options" id="option1"> Option 1
+ <label class="btn btn-primary active">
+ <input type="radio" name="options" id="option1" checked> Option 1 (preselected)
</label>
<label class="btn btn-primary">
<input type="radio" name="options" id="option2"> Option 2
@@ -81,8 +89,8 @@
</div><!-- /example -->
{% highlight html %}
<div class="btn-group" data-toggle="buttons">
- <label class="btn btn-primary">
- <input type="radio" name="options" id="option1"> Option 1
+ <label class="btn btn-primary active">
+ <input type="radio" name="options" id="option1" checked> Option 1 (preselected)
</label>
<label class="btn btn-primary">
<input type="radio" name="options" id="option2"> Option 2