:target-current

The :target-current CSS pseudo-class selects the ::scroll-marker pseudo-element of a scroll-marker-group that is currently scrolled to, in other words, the active scroll marker. This can be used to style it differently, so the user can see see their navigation position inside the scroll marker group.

Syntax

css
:target-current {
  /* ... */
}

Examples

See Creating CSS carousels for full examples that use the :target-current pseudo-class.

Basic usage

css
::scroll-marker:target-current {
  background-color: black;
}

Specifications

Specification
CSS Overflow Module Level 5
# active-scroll-marker

See also