root
/
bootstrap
mirror of https://github.com/twbs/bootstrap.git
1
0
Fork 0
Code Issues Actions 14 Packages Projects Releases Wiki Activity

Update static form control 

- Remove margin-bottom override in favor of .mb-0 utility class
- Apply the input line-height styles to match
- Remove the min-height to match the input
This commit is contained in:
Mark Otto 2016-10-09 16:16:13 -07:00
parent cab2d5951d
commit 55e130f88f
2 changed files with 3 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
docs/components/forms.md
View File

@ -516,14 +516,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 a `<p>`.
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. Using an element like `<p>` with a default margin? Be sure to use a margin override (as shown below).
{% example html %}
<form>
<div class="form-group row">
<label class="col-sm-2 col-form-label">Email</label>
<div class="col-sm-10">
<p class="form-control-static">email@example.com</p>
<p class="form-control-static mb-0">email@example.com</p>
</div>
</div>
<div class="form-group row">

4
scss/_forms.scss
View File

@ -132,12 +132,10 @@ select.form-control {
// horizontal form layout.
.form-control-static {
min-height: $input-height;
// Size it appropriately next to real form controls
padding-top: $input-padding-y;
padding-bottom: $input-padding-y;
// Remove default margin from `p`
margin-bottom: 0;
line-height: $input-line-height;
&.form-control-sm,
&.form-control-lg {