:target-before | CSS Selectors & Pseudo-classes

An experimental pseudo-class that matches a 'scroll marker' when it represents an item that comes BEFORE the current viewport in a scroll container.

Quick example

.carousel::scroll-marker:target-before {
  /* Adds an indicator or fades out markers for items the user has already scrolled past */
  opacity: 0.2;
}

:target-before Browser Support

Limited availability 62% global usage

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Not ready for production without a fallback.

View on caniuse.com → View on MDN → View on webstatus.dev → View spec → Learn more about Baseline →

142+