fix issue: Backdrop Root concept undocumented

[kb42]

Description

Clarify that backdrop-filter only affects the backdrop image up to its nearest ancestor Backdrop Root as stated in the issue, and add a concise note listing what triggers a Backdrop Root which was obtained from the source listed in this PR.

Motivation

The existing text (“area behind an element”) implied that backdrop-filter applies to all pixels behind an element, which contradicts real-world behavior and the Filter Effects Level 2 specification. Developers encountered “missing” blur outside the nearest Backdrop Root (for example, a semi-transparent ancestor), leading to confusion. This update aligns MDN’s description with the spec and addresses user reports in the GitHub issue.

Additional details

• Filter Effects Level 2 (Backdrop Root definition)
  https://drafts.fxtf.org/filter-effects-2/#BackdropRoot
• Live demo showing blur limited to the nearest Backdrop Root
  https://jsfiddle.net/xer31ywj/

Related issues and pull requests

Fixes #40602

[github-actions]

Preview URLs

• /en-US/docs/Web/CSS/backdrop-filter

Flaws (4)

URL: /en-US/docs/Web/CSS/backdrop-filter
Title: backdrop-filter
Flaw count: 4

• broken_links:
  • Can't resolve /en-US/docs/Web/CSS/zero
  • Can't resolve /en-US/docs/Web/CSS/url-modifier
  • Can't resolve /en-US/docs/Web/CSS/url-token
  • Can't resolve /en-US/docs/Web/CSS/url-modifier

(comment last updated: 2025-08-07 03:47:52)