From: Mark Otto <markdotto@gmail.com>
Date: Sat, 10 Jun 2017 23:31:36 +0000 (-0700)
Subject: add labels and ids
X-Git-Tag: v4.0.0-beta~147^2~10
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=dc5a1db62589507075ed8b592f862239f7098944;p=thirdparty%2Fbootstrap.git

add labels and ids
---

diff --git a/docs/4.0/components/forms.md b/docs/4.0/components/forms.md
index 845002c2fe..dba81ce5b4 100644
--- a/docs/4.0/components/forms.md
+++ b/docs/4.0/components/forms.md
@@ -901,12 +901,41 @@ While these feedback styles cannot be styled with CSS, you can still customize t
 <form>
   <div class="row">
     <div class="col-md-6 mb-3">
-      <input type="text" class="form-control" placeholder="First name" value="Mark" required>
+      <label for="validationDefault01">First name</label>
+      <input type="text" class="form-control" id="validationDefault01" placeholder="First name" value="Mark" required>
     </div>
     <div class="col-md-6 mb-3">
-      <input type="text" class="form-control" placeholder="Last name" value="Otto" required>
+      <label for="validationDefault02">Last name</label>
+      <input type="text" class="form-control" id="validationDefault02" placeholder="Last name" value="Otto" required>
     </div>
   </div>
+  <div class="row">
+    <div class="col-md-6 mb-3">
+      <label for="validationDefault03">City</label>
+      <input type="text" class="form-control" id="validationDefault03" placeholder="City" required>
+      <div class="invalid-feedback">
+        Please provide a valid city.
+      </div>
+    </div>
+    <div class="col-md-3 mb-3">
+      <label for="validationDefault04">State</label>
+      <input type="text" class="form-control" id="validationDefault04" placeholder="State" required>
+      <div class="invalid-feedback">
+        Please provide a valid state.
+      </div>
+    </div>
+    <div class="col-md-3 mb-3">
+      <label for="validationDefault05">Zip</label>
+      <input type="text" class="form-control" id="validationDefault05" placeholder="Zip" required>
+      <div class="invalid-feedback">
+        Please provide a valid zip.
+      </div>
+    </div>
+  </div>
+
+  <button class="btn btn-primary" type="submit">Submit form</button>
+</form>
+{% endexample %}
 
 ### Server side