Gap between checkbox/radio and it's label where clicking doesn't work

Created by: ds125v

When using the mouse to click on a checkbox/radio button you can click on the checkbox/radio button itself, or you can click on the label that is wrapped around the checkbox/radio button.

However in Bootstrap 3, unlike in version 2.3, there is a tiny gap between the two where you can click and nothing happens.

You can see this behaviour on most of the example forms with checkboxes or radio buttons, though it doesn't happen on the inline forms or on the inline-checkboxes due to their slightly different styles.

http://getbootstrap.com/css/#forms

I think it's something to do with interaction between display: inline on the label, and float: left and negative left margin on the input itself.