Checkbox group with role="group"

← Return to main list

This is a test case designed to determine how the group role is announced in relation to a checkbox group by various screen readers.

Example

Code

<div role="group" aria-labelledby="group-heading">
  <h3 id="group-heading">Favourite animal</h3>
  <div class="form-group">
    <input type="checkbox" id="dog">
    <label for="dog">Dog</label>
  </div>
  <div class="form-group">
    <input type="checkbox" id="cat">
    <label for="cat">Cat</label>
  </div>
  <div class="form-group">
    <input type="checkbox" id="rabbit">
    <label for="rabbit">Rabbit</label>
  </div>
</div>

Assistive technologies

← Return to main list