Fix form-control-feedback position when label has sr-only class

[reywood]

Fixes feedback positioning in the case where the label contained within a form group has the sr-only class. Example HTML:

<div class="form-group has-feedback">
    <label class="control-label sr-only">Label</label>
    <input type="text" class="form-control">
    <span class="glyphicon glyphicon-ok form-control-feedback"></span>
</div>

This jsbin has a few form-group variations, the first of which illustrates the bug. This jsbin uses the same HTML but adds my proposed CSS fix.

This case was mentioned in issue #12873.

[mdo]

Hmm, alright, I'm more partial to this now after seeing it a few times over. Thanks for opening this PR. Few points of feedback:

• Check your indentation—Bootstrap's CSS is two spaces.
• Can you take a stab at adding an example to our documentation with this use case?

I can help with the latter, but if you want to take a stab, I'd like to give you the chance :).

[reywood]

Whoops, indent fixed. I'll give it a go with the docs.

[reywood]

Alright, I added an example to the docs and reworked the bs-callout for optional icons to match. I added H4s between the examples to break them up visually. I won't be offended if you change them. :)

[reywood]

One note, I did not commit the recompiled versions of bootstrap.css, etc as I figured that would make merging more of a pain.

[mdo]

Thanks, @reywood. Made a few changes and merged it all in. <3

[reywood]

Awesome, thanks!