Clickable <label> test

Index page

These tests are to determine whether the <label> contents are clickable as well as the form control itself when the <label> is wrapped or unwrapped.

Example 01: Unwrapped <label>

Code

<form action="#">
  <input id="one" type="checkbox">
  <label for="one">Subscribe</label>
</form>

Dummy link after


Example 02: Wrapped <label>

Code

<form action="#">
  <label for="two">
    <input id="two" type="checkbox">
    Subscribe
  </label>
</form>

Dummy link after


Results

All modern browsers include the <label> and checkbox as triggers to change the state of the checkbox.

Index page