mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-05-21 13:24:08 +03:00
Code Activity

Merge branch 'v4-dev' into form-tweaks

Browse Source
This commit is contained in:
Mark Otto
2017-05-01 21:54:50 -07:00
committed by GitHub
parent ca44f5b03a e00de46540
commit 8c7fe6cf14
20 changed files with 294 additions and 220 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/components/forms.md
+7 -7
View File
@@ -376,7 +376,7 @@ Be sure to add `.col-form-label` to your `<label>`s as well so they're verticall
</div>
</fieldset>
<div class="form-group row">
<label class="col-sm-2">Checkbox</label>
<div class="col-sm-2">Checkbox</div>
<div class="col-sm-10">
<div class="form-check">
<label class="form-check-label">
@@ -569,14 +569,14 @@ Should you have no text within the `<label>`, the input is positioned as you'd e
## Static controls
When you need to place plain text next to a form label within a form, use the `.form-control-static` class on an element of your choice.
If you want to have read-only fields in your form styled as plain text, use the `.form-control-static` class to remove the default form field styling and preserve the correct margin and padding.
{% example html %}
<form>
<div class="form-group row">
<label class="col-sm-2 col-form-label">Email</label>
<label for="staticEmail" class="col-sm-2 col-form-label">Email</label>
<div class="col-sm-10">
<p class="form-control-static">email@example.com</p>
<input type="text" readonly class="form-control-static" id="staticEmail" value="email@example.com">
</div>
</div>
<div class="form-group row">
@@ -591,8 +591,8 @@ When you need to place plain text next to a form label within a form, use the `.
{% example html %}
<form class="form-inline">
<div class="form-group">
<label class="sr-only">Email</label>
<p class="form-control-static">email@example.com</p>
<label for="staticEmail2" class="sr-only">Email</label>
<input type="text" readonly class="form-control-static" id="staticEmail2" value="email@example.com">
</div>
<div class="form-group mx-sm-3">
<label for="inputPassword2" class="sr-only">Password</label>
@@ -604,7 +604,7 @@ When you need to place plain text next to a form label within a form, use the `.
## Disabled states
Add the `disabled` boolean attribute on an input to prevent user interactions. Disabled inputs appear lighter and add a `not-allowed` cursor.
Add the `disabled` boolean attribute on an input to prevent user interactions and make it appear lighter.
{% highlight html %}
<input class="form-control" id="disabledInput" type="text" placeholder="Disabled input here..." disabled>