Checkbox

Native checkboxes at a comfortable size, grouped in fieldsets.

Which records do you need?

Birth certificate

Marriage certificate

Show the markup

<fieldset class="cc-fieldset">
  <legend>Which records do you need?</legend>
  <div class="cc-choice">
    <input type="checkbox" id="ex-cb-birth">
    <label for="ex-cb-birth">Birth certificate</label>
  </div>
  <div class="cc-choice">
    <input type="checkbox" id="ex-cb-marriage">
    <label for="ex-cb-marriage">Marriage certificate</label>
  </div>
</fieldset>

Accessibility

Real input[type=checkbox], enlarged — state, keyboard and announcements are native.
The label fills the row and is itself the 44px target (2.5.5). The box glyph is smaller by design — it is the label you click, and it is the conforming target — the row div is not clickable, so the target has to be the label.