Merge branch 'pr/13320'

Conflicts:
	dist/css/bootstrap-rtl.min.css
	dist/css/bootstrap.css.map
	dist/css/bootstrap.min.css
	docs/dist/css/bootstrap-rtl.min.css
	docs/dist/css/bootstrap.css.map
	docs/dist/css/bootstrap.min.css

dist/css/bootstrap-rtl.css

@@ -3331,6 +3331,10 @@ select[multiple].input-lg {
   color: #a94442;
 }
 
+.has-feedback label.sr-only ~ .form-control-feedback {
+  top: 0;
+}
+
 .form-control-static {
   margin-bottom: 0;
 }

dist/css/bootstrap.css

@@ -2587,6 +2587,9 @@ select[multiple].input-lg {
 .has-error .form-control-feedback {
   color: #a94442;
 }
+.has-feedback label.sr-only ~ .form-control-feedback {
+  top: 0;
+}
 .form-control-static {
   margin-bottom: 0;
 }

docs/_includes/css/forms.html

@@ -511,7 +511,7 @@
   <p>You can also add optional feedback icons with the addition of <code>.has-feedback</code> and the right icon.</p>
   <div class="bs-callout bs-callout-warning">
     <h4>Icons, labels, and input groups</h4>
-    <p>Manual positioning of feedback icons is required for inputs without a label and for <a href="../components#input-groups">input groups</a> with an add-on on the right. For inputs without labels, adjust the <code>top</code>value. For input groups, adjust the <code>right</code> value to an appropriate pixel value depending on the width of your addon.</p>
+    <p>Manual positioning of feedback icons is required for inputs without a label and for <a href="../components#input-groups">input groups</a> with an add-on on the right. You are strongly encouraged to provide labels for all inputs for accessibility reasons. If you wish to prevent labels from being displayed, hide them with the <code>sr-only</code> class. If you must do without labels, adjust the <code>top</code> value of the feedback icon. For input groups, adjust the <code>right</code> value to an appropriate pixel value depending on the width of your addon.</p>
   </div>
   <div class="bs-example">
     <form role="form">
@@ -550,7 +550,7 @@
 </div>
 {% endhighlight %}
 
-  <p>Optional icons also work on horizontal and inline forms.</p>
+  <h4>Optional icons in horizontal and inline forms</h4>
   <div class="bs-example">
     <form class="form-horizontal" role="form">
       <div class="form-group has-success has-feedback">
@@ -593,6 +593,23 @@
 </form>
 {% endhighlight %}
 
+  <h4>Optional icons with hidden <code>.sr-only</code> labels</h4>
+  <p>For form controls with no visible label, add the <code>.sr-only</code> class on the label. Bootstrap will automatically adjust the position of the icon once it's been added.</p>
+  <div class="bs-example">
+    <div class="form-group has-success has-feedback">
+      <label class="control-label sr-only" for="inputSuccess5">Hidden label</label>
+      <input type="text" class="form-control" id="inputSuccess5">
+      <span class="glyphicon glyphicon-ok form-control-feedback"></span>
+    </div>
+  </div>
+{% highlight html %}
+<div class="form-group has-success has-feedback">
+  <label class="control-label sr-only" for="inputSuccess5">Hidden label</label>
+  <input type="text" class="form-control" id="inputSuccess5">
+  <span class="glyphicon glyphicon-ok form-control-feedback"></span>
+</div>
+{% endhighlight %}
+
 
   <h2 id="forms-control-sizes">Control sizing</h2>
   <p>Set heights using classes like <code>.input-lg</code>, and set widths using grid column classes like <code>.col-lg-*</code>.</p>

less/forms.less

@@ -322,6 +322,12 @@ input[type="checkbox"],
 }
 
 
+// Reposition feedback icon if label is hidden with "screenreader only" state
+.has-feedback label.sr-only ~ .form-control-feedback {
+  top: 0;
+}
+
+
 // Static form control text
 //
 // Apply class to a `p` element to make any string of text align with labels in