Editorial review: Document :target-before and :target-after pseudos

[chrisdavidmills]

Description

Chrome 142 adds support for the :target-before and :target-after pseudo classes. See https://chromestatus.com/feature/5120827674722304.

This PR adds reference docs for the new pseudos, and adds mention and coverage of them in appropriate places.

Motivation

Additional details

Related issues and pull requests

[github-actions]

Preview URLs (9 pages)

• /en-US/docs/Web/CSS/Guides/Overflow/Carousels
• /en-US/docs/Web/CSS/Guides/Overflow
• /en-US/docs/Web/CSS/Reference/Properties/scroll-marker-group
• /en-US/docs/Web/CSS/Reference/Properties/scroll-target-group
• /en-US/docs/Web/CSS/Reference/Selectors/::scroll-marker-group
• /en-US/docs/Web/CSS/Reference/Selectors/::scroll-marker
• /en-US/docs/Web/CSS/Reference/Selectors/:target-after
• /en-US/docs/Web/CSS/Reference/Selectors/:target-before
• /en-US/docs/Web/CSS/Reference/Selectors/:target-current

Flaws (4)

Note! 6 documents with no flaws that don't need to be listed. 🎉

URL: /en-US/docs/Web/CSS/Guides/Overflow/Carousels
Title: Creating CSS carousels
Flaw count: 1

• unknown:
  • Error parsing /shared-assets/images/diagrams/css/carousels/carousel.svg: No such file or directory (os error 2)

---

URL: /en-US/docs/Web/CSS/Reference/Properties/scroll-marker-group
Title: scroll-marker-group
Flaw count: 2

• broken_links:
  • /en-US/docs/Web/CSS/CSS_values_and_units/Value_definition_syntax#single_bar is a redirect
  • /en-US/docs/Web/CSS/CSS_values_and_units/Value_definition_syntax#single_bar is a redirect

---

URL: /en-US/docs/Web/CSS/Reference/Properties/scroll-target-group
Title: scroll-target-group
Flaw count: 1

• broken_links:
  • /en-US/docs/Web/CSS/CSS_values_and_units/Value_definition_syntax#single_bar is a redirect

External URLs (2)

URL: /en-US/docs/Web/CSS/Reference/Selectors/:target-after
Title: :target-after

• https://chrome.dev/carousel/ (1 time) (Note! This may be a new URL 👀)

---

URL: /en-US/docs/Web/CSS/Reference/Selectors/:target-before
Title: :target-before

• https://chrome.dev/carousel/ (1 time) (Note! This may be a new URL 👀)

(comment last updated: 2025-11-25 10:53:57)

[danielsakhapov]

LGTM

[estelle]

Please use macros in the css docs whenever possible

[chrisdavidmills]

I usually do, but at the moment, I'm using raw markdown links until the cssxref macro is fixed. Last time I checked, it was still broken for new links.

[estelle]

add an outline or some other non-color differentiator for those who can't distinguish reds

[chrisdavidmills]

In this case, the three different link states (before, current, and after) are distinguished by gray and line-through, red, and black and underlined, so they are not distinguished by color alone.