5.1.5 Radios (multiple) View in a new window
The standard input[type="radio"]
element, using a fieldset and legend as
the accessible way to group and label multiple radio inputs.
Optionally a tooltip can be used by using the aria-describedby
attribute
on the fieldset itself.
Twig: form/input/input-radio.twig
Example
Markup
<fieldset class="form__item form--radios" aria-describedby="radioHelp">
<legend>A set of radio inputs</legend>
<div class="form__radio">
<input type="radio" id="radio1" name="radio">
<label for="radio1">This is an example radio button</label>
</div>
<div class="form__radio">
<input type="radio" id="radio2" name="radio">
<label for="radio2">This is an example <em>radio button</em></label>
</div>
<div class="form__radio">
<input type="radio" id="radio3" name="radio">
<label for="radio3">This is an example <strong>radio button</strong></label>
</div>
<div class="form__radio">
<input type="radio" id="radio4" name="radio">
<label for="radio4">This is an example <em><strong>radio button</strong></em></label>
</div>
<div class="form__radio">
<input type="radio" id="radio5" name="radio">
<label for="radio5">This is an example <a href="#">radio button</a></label>
</div>
<div role="tooltip" id="radioHelp" class="form__description">Help text that provides additional information about the field.</div>
</fieldset>