Ensure element has sufficient target size

(In development)

Ensure the target size of elements is sufficient for interaction. When targets are small, users might not be able to touch them - or touch the wrong target.

Minimum touch target sizes:

  • 24x24 CSS pixels at WCAG 2.2 level AA
  • 44x44 CSS pixels at WCAG 2.1 level AAA
  • 48x48 density-independent pixels (dp) on Android
  • 44x44 points (pt) on iOS

Impact

Users with physical impairments might not be able to click small targets that are close together.

Solutions

Add padding to your elements if they are too small.

Elements

Testing

Automated testing

This issue can be detected automatically with the Abra Test Engine.

Manual testing

The target size cannot be determined accurately through manual testing.

Guidelines