2
0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-05-30 15:24:08 +03:00

fixes #9382: inline forms now require use of .form-group for proper alignment of all form controls

This commit is contained in:
Mark Otto
2013-08-12 11:07:23 -07:00
parent a9a27d3794
commit f662dff6e9
5 changed files with 94 additions and 68 deletions
+16 -8
View File
@@ -1394,10 +1394,14 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<p>Screen readers will have trouble with your forms if you don't include a label for every input. For these inline forms, you can hide the labels using the <code>.sr-only</code> class.</p>
</div>
<form class="bs-example form-inline" role="form">
<label class="sr-only" for="exampleInputEmail">Email address</label>
<input type="text" class="form-control" id="exampleInputEmail" placeholder="Enter email">
<label class="sr-only" for="exampleInputPassword">Password</label>
<input type="password" class="form-control" id="exampleInputPassword" placeholder="Password">
<div class="form-group">
<label class="sr-only" for="exampleInputEmail">Email address</label>
<input type="text" class="form-control" id="exampleInputEmail" placeholder="Enter email">
</div>
<div class="form-group">
<label class="sr-only" for="exampleInputPassword">Password</label>
<input type="password" class="form-control" id="exampleInputPassword" placeholder="Password">
</div>
<div class="checkbox">
<label>
<input type="checkbox"> Remember me
@@ -1407,10 +1411,14 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
</form><!-- /example -->
{% highlight html %}
<form class="form-inline" role="form">
<label class="sr-only" for="exampleInputEmail">Email address</label>
<input type="text" class="form-control" id="exampleInputEmail" placeholder="Enter email">
<label class="sr-only" for="exampleInputPassword">Password</label>
<input type="password" class="form-control" id="exampleInputPassword" placeholder="Password">
<div class="form-group">
<label class="sr-only" for="exampleInputEmail">Email address</label>
<input type="text" class="form-control" id="exampleInputEmail" placeholder="Enter email">
</div>
<div class="form-group">
<label class="sr-only" for="exampleInputPassword">Password</label>
<input type="password" class="form-control" id="exampleInputPassword" placeholder="Password">
</div>
<div class="checkbox">
<label>
<input type="checkbox"> Remember me