5.1.3 Checkbox (multiple) View in a new window
The standard input[type="checkbox"]
element, using a fieldset and legend as
the accessible way to group and label multiple checkbox inputs.
Optionally a tooltip can be used by using the aria-describedby
attribute
on the fieldset itself.
Twig: form/input/input-checkbox.twig
Example
Markup
<fieldset class="form__item form--checkboxes {{ modifier_class }}" aria-describedby="checkboxHelp" >
<legend>A set of checkbox inputs</legend>
<div class="form__checkbox">
<input type="checkbox" id="checkbox1">
<label for="checkbox1">This is an example checkbox</label>
</div>
<div class="form__checkbox">
<input type="checkbox" id="checkbox2">
<label for="checkbox2">This is an example <em>checkbox</em></label>
</div>
<div class="form__checkbox">
<input type="checkbox" id="checkbox3">
<label for="checkbox3">This is an example <strong>checkbox</strong></label>
</div>
<div class="form__checkbox">
<input type="checkbox" id="checkbox4">
<label for="checkbox4">This is an example <em><strong>checkbox</strong></em></label>
</div>
<div class="form__checkbox">
<input type="checkbox" id="checkbox5">
<label for="checkbox5">This is an example <a href="#">checkbox</a></label>
</div>
<div role="tooltip" id="checkboxHelp" class="form__description">Help text that provides additional information about the field.</div>
</fieldset>