Skip to content

fix(mix-blend-mode): replace "parent and background" with "backdrop" in description#44323

Open
xonaib wants to merge 2 commits into
mdn:mainfrom
xonaib:fix-mix-blend-mode-backdrop
Open

fix(mix-blend-mode): replace "parent and background" with "backdrop" in description#44323
xonaib wants to merge 2 commits into
mdn:mainfrom
xonaib:fix-mix-blend-mode-backdrop

Conversation

@xonaib
Copy link
Copy Markdown

@xonaib xonaib commented Jun 1, 2026

Fixes #41078

The current description says the element blends with "the content of the element's parent
and the element's background", which has two problems:

  1. "element's background" implies the CSS background property of the element itself.
    That is what background-blend-mode does. mix-blend-mode does NOT blend with the
    element's own background.

  2. "element's parent" is imprecise. Blending happens against the backdrop — all rendered
    content behind the element within the same stacking context — which may include siblings,
    not just the parent.

Per the W3C CSS Compositing and Blending spec §3.4.1:

"An element that has blending applied, must blend with all the underlying content of
the stacking context that that element belongs to."

Changes:

  • Replaced the inaccurate description with "backdrop" (the spec's term), linked to
    the stacking context guide
  • Added a Note callout clarifying the distinction from background-blend-mode

Verified locally:

  • markdownlint-cli2 files/en-us/web/css/reference/properties/mix-blend-mode/index.md
  • node scripts/filecheck/index.js --cwd=. files/en-us/web/css/reference/properties/mix-blend-mode/index.md
  • MDN pre-commit checks: changed xrefs, front matter, Prettier, Markdownlint

@xonaib xonaib requested a review from a team as a code owner June 1, 2026 12:28
@xonaib xonaib requested review from pepelsbey and removed request for a team June 1, 2026 12:28
@github-actions github-actions Bot added Content:CSS Cascading Style Sheets docs size/s [PR only] 6-50 LoC changed labels Jun 1, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Content:CSS Cascading Style Sheets docs size/s [PR only] 6-50 LoC changed

Projects

None yet

Development

Successfully merging this pull request may close these issues.

mix-blend-mode does not blend the element with its background but with its backdrop

2 participants