mirror of
https://github.com/twbs/bootstrap.git
synced 2024-12-01 13:24:25 +01:00
Cleanup .navbar-form styles
* Nuke the commented out navbar forms code that's not currently needed * Add a few more examples to the .navbar-form docs section * Remove (for now at least) top padding on checkbox and radios
This commit is contained in:
parent
a4f2c9e156
commit
bec8c90fd7
@ -3476,12 +3476,44 @@ For example, <code><section></code> should be wrapped as inline.
|
||||
<h3 id="navbar-forms">Forms</h3>
|
||||
<p>To properly style and position a form within the navbar, add the appropriate classes as shown below. For a default form, include <code>.navbar-form</code> and either <code>.pull-left</code> or <code>.pull-right</code> to properly align it.</p>
|
||||
<div class="bs-docs-example">
|
||||
|
||||
<div class="navbar">
|
||||
<form class="navbar-form pull-left">
|
||||
<input type="text" style="width: 200px;">
|
||||
<button type="submit" class="btn">Submit</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="navbar">
|
||||
<form class="navbar-form pull-left">
|
||||
<select name="" id="" style="width: 200px;">
|
||||
<option value="1">1</option>
|
||||
<option value="1">1</option>
|
||||
<option value="1">1</option>
|
||||
<option value="1">1</option>
|
||||
</select>
|
||||
<button type="submit" class="btn">Submit</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="navbar">
|
||||
<form class="navbar-form pull-left">
|
||||
<input type="text" style="width: 200px;">
|
||||
<input type="checkbox">
|
||||
<button type="submit" class="btn">Submit</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="navbar">
|
||||
<form class="navbar-form pull-left">
|
||||
<input type="text" style="width: 200px;">
|
||||
<label class="checkbox-inline">
|
||||
<input type="checkbox"> Derp
|
||||
</label>
|
||||
<button type="submit" class="btn">Submit</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</div><!-- /example -->
|
||||
{% highlight html %}
|
||||
<form class="navbar-form pull-left">
|
||||
|
@ -193,17 +193,19 @@ textarea {
|
||||
margin-top: ((@line-height-base / 4) * -1);
|
||||
}
|
||||
|
||||
/*
|
||||
// Move the options list down to align with labels
|
||||
.controls > .radio:first-child,
|
||||
.controls > .checkbox:first-child {
|
||||
padding-top: 5px; // has to be padding because margin collaspes
|
||||
}
|
||||
*/
|
||||
|
||||
// Radios and checkboxes on same line
|
||||
.radio-inline,
|
||||
.checkbox-inline {
|
||||
display: inline-block;
|
||||
padding-top: 5px;
|
||||
// padding-top: 5px;
|
||||
padding-left: 20px;
|
||||
margin-bottom: 0;
|
||||
vertical-align: middle;
|
||||
|
@ -336,36 +336,5 @@
|
||||
margin-top: 0; // then undo the margin here so we don't accidentally double it
|
||||
}
|
||||
|
||||
// Navbar forms
|
||||
// -------------------------
|
||||
.navbar-form {
|
||||
margin-bottom: 0; // remove default bottom margin
|
||||
.clearfix();
|
||||
input,
|
||||
select,
|
||||
.radio,
|
||||
.checkbox {
|
||||
.navbarVerticalAlign(30px); // Vertically center in navbar
|
||||
}
|
||||
input,
|
||||
select,
|
||||
.btn {
|
||||
display: inline-block;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
input[type="image"],
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
margin-top: 3px;
|
||||
}
|
||||
.input-append,
|
||||
.input-prepend {
|
||||
margin-top: 5px;
|
||||
white-space: nowrap; // preven two items from separating within a .navbar-form that has .pull-left
|
||||
input {
|
||||
margin-top: 0; // remove the margin on top since it's on the parent
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
*/
|
||||
|
Loading…
Reference in New Issue
Block a user