Understanding Success Criterion 2.5.8: Pointer Target Spacing

Success Criterion 2.5.8 Pointer Target Spacing (Level AA): For each target, there is an area with a width and height of at least 44 CSS pixels that includes it, and no other targets, except when:

This criterion has been formulated to increase the hit-area of small targets, but the group would like feedback from providers of touch-screen devices if there is another way of forming the criterion to better complement the tap-heuristics used.

Are there issues with internationalization when describing inline links?

Are there issues with pop-over content overlapping targets triggering failures?


This understanding document is part of the draft WCAG 2.2 content. It may change or be removed before the final WCAG 2.2 is published.


The intent of this Success Criterion is to ensure targets can easily be activated without accidentally activating an adjacent target. When targets are small, it is difficult for users with hand tremors and those who have difficulty with fine motor movement to activate them accurately. Providing spacing between targets will reduce the likelihood of accidentally activating the wrong control.

The requirement is for targets that are smaller than 44 x 44px to be included in an area with a width and height of at least 44px each. For the horizontal dimension, this means that the total width of 44px is composed of the width of the target and the width of the spacing that separates it from adjacent targets. The same applies to the height. For example, a target of 24 x 24px would meet the requirement if it had a spacing of 10 px on all sides. If the target is 44 x 44px or larger, no spacing between it and adjacent targets would be required.

There are three exceptions:

  1. If there is a mechanism to change the target sizes or spacing to meet the minimum, such as a button to change the sizes and layout of the targets.
  2. If the target is inline within a sentence there doesn’t need to be a minimum target size.
  3. If the spacing of the targets is essential to the information being conveyed there doesn’t need to be a minimum target size.

The requirement is independent of the zoom factor of the page, when users zoom in the CSS pixel size of elements does not change. This means that authors cannot meet it by claiming that the target will have enough spacing or sufficient size if the user zooms into the page.

The requirement does not apply to the spacing of targets inside unstyled native elements. For example, when a default select element is used, the vertical spacing of option elements inside the select's dropdown list is exempt.

While the Success Criterion primarily helps touch users by ensuring that activation with the 'fat finger' will not accidentally trigger adjacent targets, it is also useful for mouse or pen users. It reduces the chances of erroneous activation due to a tremor or some other input imprecision.

As mobile devices generally have internal heuristics to identify which link is closest, spacing can work as effectively as a larger target size.

A series of icons with measures showing they are each 44 by 44 pixels wide and high.
Figure 1 The dimension of each icon target in a row is 44 by 44 CSS pixels, so the targets pass this Success Criterion without additional spacing.
A row of icons with measures showing they are each 38 by 38 pixels wide and high, with 6 pixel spacing between them.
Figure 2 The dimension of each icon target in a row is 38 by 38 CSS pixels, so a spacing of 6 CSS pixels is required to arrive at 44 CSS pixels for the combined width and spacing of the target. No adjacent targets are present above and below, i.e., there is sufficient vertical spacing for the height of 38 CSS pixels to be sufficient.
A row of buttons which are more that 44px wide and 20px high. There are no targets above or below.
Figure 3 The widths of the button with adjacent neighbors is at least 44 CSS pixels, while the height is only 22 CSS pixels. The target height combined with the vertical spacing above and below exceeds 44 CSS pixels, therefore, the targets pass this Success Criterion.
A row of icons which are 44px wide and 20px high, with other targets above and below with only 2px spacing.
Figure 4 Fail: Two rows of buttons, all with a height of only 20 CSS pixels. In the top row, buttons all have a width of more than 44 CSS pixels. For the top row, targets above and below are in close proximity. The top spacing of the first row is 4 px while the bottom spacing is 2 px, which adds up to 26 px for target height and vertical spacing combined. Therefore, the buttons in the top row fail the Success Criterion. The button "Pop" in the second row is only 32px wide with no horizontal spacing, so it also fails the Success Criterion even when there is sufficient space below to meet the vertical spacing requirement.

Where targets are embedded inside other targets, the inner target either needs a size of at least 44 x 44 CSS pixels or must be placed at the edge or corner to make sure that there is sufficient adjacent spacing in each dimension.

Three examples of a target adjacent to another target (see legend below)
Figure 5 Three examples of a person's profile image, which is supposed to be a target leading to another page, and a magnifying glass icon, which is supposed to open a lightbox view of the profile image. In the first example, the magnifying icon is outside the picture and passes. In the second example, the icon overlaps with the top-left corner of the image, but passes due to sufficient spacing top and left. In the third example, the icon sits inside the linked image. Since it is surrounded by an active click area, the icon target is not large enough to pass the success criterion.

Users with different disabilities have different needs for control sizes. It can be beneficial to provide an option to increase the active target area without increasing the visible target size. Another option is to provide a mechanism to control the density of layout and thereby change target size or spacing, or both. This can be beneficial for a wide range of users. For example, users with visual field loss may prefer a more condensed layout with smaller sized controls while users with other forms of low vision may prefer large controls.

Where user-agents control the size of a target, such as the options in a select drop-down, and the author has not tried to change the size of target with size or padding adjustments, the target is exempted from this criterion. It would be beneficial for users if the minimum size & spacing requirement is met, but where the user-agent has defined the target it is not the authors responsibility.


Having targets with sufficient target spacing can help all users who may have difficulty in confidently targeting or operating small controls. Users who benefit include, but are not limited to:



Each numbered item in this section represents a technique or combination of techniques that the WCAG Working Group deems sufficient for meeting this Success Criterion. However, it is not necessary to use these particular techniques. For information on using other techniques, see Understanding Techniques for WCAG Success Criteria, particularly the "Other Techniques" section.

Sufficient Techniques

  1. C42: Using min-height and min-width to ensure sufficient target spacing

Key Terms

assistive technology

hardware and/or software that acts as a user agent, or along with a mainstream user agent, to provide functionality to meet the requirements of users with disabilities that go beyond those offered by mainstream user agents


functionality provided by assistive technology includes alternative presentations (e.g., as synthesized speech or magnified content), alternative input methods (e.g., voice), additional navigation or orientation mechanisms, and content transformations (e.g., to make tables more accessible).


Assistive technologies often communicate data and messages with mainstream user agents by using and monitoring APIs.


The distinction between mainstream user agents and assistive technologies is not absolute. Many mainstream user agents provide some features to assist individuals with disabilities. The basic difference is that mainstream user agents target broad and diverse audiences that usually include people with and without disabilities. Assistive technologies target narrowly defined populations of users with specific disabilities. The assistance provided by an assistive technology is more specific and appropriate to the needs of its target users. The mainstream user agent may provide important functionality to assistive technologies like retrieving Web content from program objects or parsing markup into identifiable bundles.

Assistive technologies that are important in the context of this document include the following:

  • screen magnifiers, and other visual reading assistants, which are used by people with visual, perceptual and physical print disabilities to change text font, size, spacing, color, synchronization with speech, etc. in order to improve the visual readability of rendered text and images;
  • screen readers, which are used by people who are blind to read textual information through synthesized speech or braille;
  • text-to-speech software, which is used by some people with cognitive, language, and learning disabilities to convert text into synthetic speech;
  • speech recognition software, which may be used by people who have some physical disabilities;
  • alternative keyboards, which are used by people with certain physical disabilities to simulate the keyboard (including alternate keyboards that use head pointers, single switches, sip/puff and other special input devices.);
  • alternative pointing devices, which are used by people with certain physical disabilities to simulate mouse pointing and button activations.

satisfying all the requirements of a given standard, guideline or specification


process or technique for achieving a result


The mechanism may be explicitly provided in the content, or may be relied upon to be provided by either the platform or by user agents, including assistive technologies.


The mechanism needs to meet all success criteria for the conformance level claimed.


series of user actions where each action is required in order to complete an activity

Successful use of a series of Web pages on a shopping site requires users to view alternative products, prices and offers, select products, submit an order, provide shipping information and provide payment information.

An account registration page requires successful completion of a Turing test before the registration form can be accessed.

relied upon

the content would not conform if that technology is turned off or is not supported


region of the display that will accept a pointer action, such as the interactive area of a user interface component


If two or more touch targets are overlapping, the overlapping area should not be included in the measurement of the target size, except when the overlapping targets perform the same action or open the same page.


mechanism for encoding instructions to be rendered, played or executed by user agents


As used in these guidelines "Web Technology" and the word "technology" (when used alone) both refer to Web Content Technologies.


Web content technologies may include markup languages, data formats, or programming languages that authors may use alone or in combination to create end-user experiences that range from static Web pages to synchronized media presentations to dynamic Web applications.

Some common examples of Web content technologies include HTML, CSS, SVG, PNG, PDF, Flash, and JavaScript.

user agent

any software that retrieves and presents Web content for users

Web browsers, media players, plug-ins, and other programs — including assistive technologies — that help in retrieving, rendering, and interacting with Web content.