Annex

Fixing Target Size (Minimum) on WooCommerce (WCAG 2.5.8)

Interactive controls must be at least 24 by 24 CSS pixels, unless they have enough spacing around them or an equivalent larger control exists elsewhere on the page.

Why it matters

New in WCAG 2.2, so a site audited before 2023 has almost certainly never been checked against it. On a store it hits the quantity stepper, the colour swatch row, the star rating input, the close control on the cookie banner and the pagination numbers — all of which tend to be drawn small and packed tightly. On mobile, where most storefront traffic now sits, an undersized quantity control means the customer taps 'remove' when they meant 'decrease'. That is a lost basket, not an inconvenience.

WooCommerce — where to look

Theme quantity input styles; variation swatch plugin styles; cookie consent plugin.

What to do

Increase the padding on the quantity controls and swatches in the child theme. Consent plugins usually expose a close-button size setting, or can be overridden with CSS.

Verification status

Checked by reading the platform’s own source code. Core renders the quantity control as a single input rather than plus/minus buttons, so the classic undersized stepper is added by a theme or plugin. Measure whatever your theme substitutes, and the swatch row alongside it.

Source: https://github.com/woocommerce/woocommerce/blob/trunk/plugins/woocommerce/templates/global/quantity-input.php

Reference themes change. If your store runs a different or older theme, confirm the file before editing it.

How to verify the fix

  1. Open developer tools, select the control, and read its rendered box in CSS pixels — not its icon size.
  2. If a control is under 24 by 24, measure the gap to its neighbours; sufficient spacing can satisfy the criterion instead.
  3. Check the quantity stepper, swatch row, rating input and every popup close control specifically.
  4. Test at mobile viewport width, where controls are often smaller than on desktop.

Other platforms

The full criterion

Read the full explanation of WCAG 2.5.8 Target Size (Minimum), or the formal W3C definition.