All interactive targets should take up at least 24×24 CSS pixels of space. This can include white space around the target.
What you need to know
- Ensuring that targets are big enough and that there’s sufficient space between them makes it less likely that a user will accidentally activate the wrong control.
- Meeting this success criterion will make your website more accessible for people who may have difficulty with fine motor control movements and even people with large fingers.
- There are several exceptions to the 24×24 CSS pixels of space requirement. For example, if the offset of the spacing is at least 24 CSS pixels, then a target can be smaller than 24×24.
What you need to do
- Ensure that these spacing requirements are met without the use of any assistive technologies. For example, the target size requirement must be met without using the zoom feature.
- If you want to meet the AAA standard for this success criteria, make sure that targets are 44×44 CSS pixels. This will help many more people, including those using your website in unstable environments, like riding a bus, and those who may use only one hand to navigate.