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

2 files changed, 3 insertions, 5 deletions

diff --git a/docs/components/forms.md b/docs/components/forms.md
index c7da5c0fd..a2d59d920 100644
--- a/docs/components/forms.md
+++ b/docs/components/forms.md
@@ -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 protected]</p>
+      <p class="form-control-static mb-0">[email protected]</p>
     </div>
   </div>
   <div class="form-group row">
diff --git a/scss/_forms.scss b/scss/_forms.scss
index 5f5b26146..2023aa013 100644
--- a/scss/_forms.scss
+++ b/scss/_forms.scss
@@ -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 {