0
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-29 21:52:22 +01:00

Fix checkbox and radios example

This commit is contained in:
Mark Otto 2012-12-09 22:13:40 -08:00
parent 6e9bbe6232
commit 4245e8ebb5
4 changed files with 74 additions and 48 deletions

View File

@ -903,6 +903,7 @@ textarea::-webkit-input-placeholder {
.radio label,
.checkbox label {
margin-bottom: 0;
font-weight: normal;
}

View File

@ -1185,34 +1185,46 @@ For example, <code><section></code> should be wrapped as inlin
<p>Checkboxes are for selecting one or several options in a list while radios are for selecting one option from many.</p>
<h4>Default (stacked)</h4>
<form class="bs-docs-example">
<label class="checkbox">
<input type="checkbox" value="">
Option one is this and that&mdash;be sure to include why it's great
</label>
<div class="checkbox">
<label>
<input type="checkbox" value="">
Option one is this and that&mdash;be sure to include why it's great
</label>
</div>
<br>
<label class="radio">
<input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked>
Option one is this and that&mdash;be sure to include why it's great
</label>
<label class="radio">
<input type="radio" name="optionsRadios" id="optionsRadios2" value="option2">
Option two can be something else and selecting it will deselect option one
</label>
<div class="radio">
<label>
<input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked>
Option one is this and that&mdash;be sure to include why it's great
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="optionsRadios" id="optionsRadios2" value="option2">
Option two can be something else and selecting it will deselect option one
</label>
</div>
</form>
<pre class="prettyprint linenums">
&lt;label class="checkbox"&gt;
&lt;input type="checkbox" value=""&gt;
Option one is this and that&mdash;be sure to include why it's great
&lt;/label&gt;
&lt;div class="checkbox"&gt;
&lt;label&gt;
&lt;input type="checkbox" value=""&gt;
Option one is this and that&mdash;be sure to include why it's great
&lt;/label&gt;
&lt;/div&gt;
&lt;label class="radio"&gt;
&lt;input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked&gt;
Option one is this and that&mdash;be sure to include why it's great
&lt;/label&gt;
&lt;label class="radio"&gt;
&lt;input type="radio" name="optionsRadios" id="optionsRadios2" value="option2"&gt;
Option two can be something else and selecting it will deselect option one
&lt;/label&gt;
&lt;div class="radio"&gt;
&lt;label&gt;
&lt;input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked&gt;
Option one is this and that&mdash;be sure to include why it's great
&lt;/label&gt;
&lt;/div&gt;
&lt;div class="radio"&gt;
&lt;label&gt;
&lt;input type="radio" name="optionsRadios" id="optionsRadios2" value="option2"&gt;
Option two can be something else and selecting it will deselect option one
&lt;/label&gt;
&lt;/div&gt;
</pre>
<h4>Inline checkboxes</h4>

View File

@ -1125,34 +1125,46 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
<p>Checkboxes are for selecting one or several options in a list while radios are for selecting one option from many.</p>
<h4>Default (stacked)</h4>
<form class="bs-docs-example">
<label class="checkbox">
<input type="checkbox" value="">
Option one is this and that&mdash;be sure to include why it's great
</label>
<div class="checkbox">
<label>
<input type="checkbox" value="">
Option one is this and that&mdash;be sure to include why it's great
</label>
</div>
<br>
<label class="radio">
<input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked>
Option one is this and that&mdash;be sure to include why it's great
</label>
<label class="radio">
<input type="radio" name="optionsRadios" id="optionsRadios2" value="option2">
Option two can be something else and selecting it will deselect option one
</label>
<div class="radio">
<label>
<input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked>
Option one is this and that&mdash;be sure to include why it's great
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="optionsRadios" id="optionsRadios2" value="option2">
Option two can be something else and selecting it will deselect option one
</label>
</div>
</form>
<pre class="prettyprint linenums">
&lt;label class="checkbox"&gt;
&lt;input type="checkbox" value=""&gt;
Option one is this and that&mdash;be sure to include why it's great
&lt;/label&gt;
&lt;div class="checkbox"&gt;
&lt;label&gt;
&lt;input type="checkbox" value=""&gt;
Option one is this and that&mdash;be sure to include why it's great
&lt;/label&gt;
&lt;/div&gt;
&lt;label class="radio"&gt;
&lt;input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked&gt;
Option one is this and that&mdash;be sure to include why it's great
&lt;/label&gt;
&lt;label class="radio"&gt;
&lt;input type="radio" name="optionsRadios" id="optionsRadios2" value="option2"&gt;
Option two can be something else and selecting it will deselect option one
&lt;/label&gt;
&lt;div class="radio"&gt;
&lt;label&gt;
&lt;input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked&gt;
Option one is this and that&mdash;be sure to include why it's great
&lt;/label&gt;
&lt;/div&gt;
&lt;div class="radio"&gt;
&lt;label&gt;
&lt;input type="radio" name="optionsRadios" id="optionsRadios2" value="option2"&gt;
Option two can be something else and selecting it will deselect option one
&lt;/label&gt;
&lt;/div&gt;
</pre>
<h4>Inline checkboxes</h4>

View File

@ -206,6 +206,7 @@ textarea {
}
.radio label,
.checkbox label {
margin-bottom: 0;
font-weight: normal;
}
.radio input[type="radio"],