Target size - Components have a minimum target size

Design Notes

The size of the target for pointer inputs is at least 24 by 24 CSS pixels except when:

Equivalent: The function can be achieved through a different control on the same page that meets this criterion;

Inline: The target is in a sentence or block of text;

User Agent Control: The size of the target is determined by the user agent and is not modified by the author;

Essential: A particular presentation of the target is essential to the information being conveyed.

Targets that allow for values to be selected spatially based on position within the target are considered one target for the purpose of the success criterion. Examples include sliders, colour pickers displaying a gradient of colours, or editable areas where you position the cursor.

Developer Notes

Not relevant.

Testing Notes

Steps to check

  • Using the HTML console, select the item you wish to measure.
  • Ensure that the component has an area at least 24 by 24 CSS pixels.

WCAG Reference: Understanding Success Criterion 2.5.8 Target Size (Minimum)

See also: Understanding SC 2.5.5: Target Size (Enhanced)