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

update inline forms to resolve checkbox label with space in it and overlapping content, per #1969

This commit is contained in:
Mark Otto 2012-02-20 18:56:05 -08:00
parent 331c85724a
commit 143b3db2c9
5 changed files with 29 additions and 3 deletions

Binary file not shown.

View File

@ -1001,9 +1001,18 @@ input:focus:required:invalid:focus, textarea:focus:required:invalid:focus, selec
.form-search .checkbox,
.form-inline .radio,
.form-inline .checkbox {
padding-left: 0;
margin-bottom: 0;
vertical-align: middle;
}
.form-search .radio input[type="radio"],
.form-search .checkbox input[type="checkbox"],
.form-inline .radio input[type="radio"],
.form-inline .checkbox input[type="checkbox"] {
float: left;
margin-left: 0;
margin-right: 3px;
}
.control-group {
margin-bottom: 9px;
}

View File

@ -910,7 +910,7 @@ For example, <code>section</code> should be wrapped as inline.
<input type="text" class="input-small" placeholder="Email">
<input type="password" class="input-small" placeholder="Password">
<label class="checkbox">
<input type="checkbox"> Remember?
<input type="checkbox"> Remember me
</label>
<button type="submit" class="btn">Sign in</button>
</form>
@ -918,6 +918,9 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
&lt;form class="well form-inline"&gt;
&lt;input type="text" class="input-small" placeholder="Email"&gt;
&lt;input type="password" class="input-small" placeholder="Password"&gt;
&lt;label class="checkbox"&gt;
&lt;input type="checkbox"&gt; Remember me
&lt;/label&gt;
&lt;button type="submit" class="btn"&gt;Go&lt;/button&gt;
&lt;/form&gt;
</pre>

View File

@ -834,7 +834,7 @@
<input type="text" class="input-small" placeholder="{{_i}}Email{{/i}}">
<input type="password" class="input-small" placeholder="{{_i}}Password{{/i}}">
<label class="checkbox">
<input type="checkbox"> {{_i}}Remember?{{/i}}
<input type="checkbox"> {{_i}}Remember me{{/i}}
</label>
<button type="submit" class="btn">{{_i}}Sign in{{/i}}</button>
</form>
@ -842,6 +842,9 @@
&lt;form class="well form-inline"&gt;
&lt;input type="text" class="input-small" placeholder="{{_i}}Email{{/i}}"&gt;
&lt;input type="password" class="input-small" placeholder="{{_i}}Password{{/i}}"&gt;
&lt;label class="checkbox"&gt;
&lt;input type="checkbox"&gt; {{_i}}Remember me{{/i}}
&lt;/label&gt;
&lt;button type="submit" class="btn"&gt;{{_i}}Go{{/i}}&lt;/button&gt;
&lt;/form&gt;
</pre>

View File

@ -475,14 +475,25 @@ select:focus:required:invalid {
.form-inline .input-prepend .add-on {
vertical-align: middle;
}
// Inline checkbox/radio labels
// Inline checkbox/radio labels (remove padding on left)
.form-search .radio,
.form-search .checkbox,
.form-inline .radio,
.form-inline .checkbox {
padding-left: 0;
margin-bottom: 0;
vertical-align: middle;
}
// Remove float and margin, set to inline-block
.form-search .radio input[type="radio"],
.form-search .checkbox input[type="checkbox"],
.form-inline .radio input[type="radio"],
.form-inline .checkbox input[type="checkbox"] {
float: left;
margin-left: 0;
margin-right: 3px;
}
// Margin to space out fieldsets
.control-group {