I've been using formtastic in order to generate HTML forms on rails applications. My question, however, is really HTML-related.

Today I found a strange behaviour on the way formtastic generates checkboxes (fields of type :boolean on formtastic lingo).

The rest of the fields (non-checkboxes) are generated this way:

<li>
  <label for="my_textbox_field">My TextBox</label>
  <input id="my_textbox_field" type="text" ... >
</li>

Checkboxes, however, are enclosed inside their <label> tags completely - like this:

<li>
  <label for="my_boolean_field">
    <input id="my_boolean_field" type="checkbox" ... >
    This is my boolean field
  </label>
</li>

Formtastic phylosophy seems to be based on the Learning to Love Forms presentation. In effect, on slide 36 of that presentation this structure is suggested for checkboxes. I guess in the presentation itself the presenter explained why this was done, but it is not written on the slides.

Can anyone tell me why enclosing checkboxes inside their <label> tag might be a good idea, as opposed to putting them outside, like with textboxes?