How to fix nested interactive on Squarespace

Steps for Squarespace

1. In your Squarespace admin, go to Pages → [affected page] → Edit. Identify the block containing the nested interactive element.
2. If the issue is in a Button block inside a Clickable element block, remove the clickable behavior from the outer container — keep only the Button block as the interactive control.
3. For custom code injected via Settings → Advanced → Code Injection or a Code Block, edit the HTML directly: remove the nested interactive tag and replace it with a `<span>` or style the remaining single element as needed.
4. If the nesting comes from a third-party Squarespace plugin/extension, contact the developer or replace it with a custom Code Block where you control the markup.
5. Save and preview. Use the axe browser extension to confirm the violation is resolved.

What is nested interactive?

WCAG Success Criterion 4.1.2 requires that every user interface component has a name, role, and value that assistive technologies (like screen readers) can reliably understand. A "nested interactive" violation occurs when one interactive element — such as a `<button>`, `<a>`, `<select>`, or `<input>` — is placed inside another interactive element in the HTML. For example, putting a `<button>` inside an `<a>` tag, or an `<a>` link inside a `<button>`. HTML forbids this nesting, browsers handle it inconsistently, and screen readers and keyboard navigation can behave unpredictably. Adding `tabindex="-1"` or `aria-hidden="true"` to the inner element does NOT reliably hide it from assistive technology — screen readers can still discover and announce it, creating a confusing or broken experience.

Keyboard-only users and screen-reader users (a significant and legally protected segment of shoppers) can get stuck, confused, or blocked from completing a purchase when interactive controls are nested. In many jurisdictions — including the US (ADA), EU (EN 301 549), and UK (Equality Act) — inaccessible ecommerce stores face real legal exposure including complaints, audits, and lawsuits. Beyond legal risk, a broken checkout button or unclickable product link directly costs you conversions and revenue. Google also uses accessibility signals as a quality indicator, so fixing these issues can modestly improve crawlability and organic rankings over time.

See the complete Nested interactive guide for every platform and the full background.