Study · CSS · Navigation

Navigation that follows the scroll

Keep a section link current as its target moves through a scroll container.

A table of contents can reflect which section is currently in view. scroll-target-group: auto turns fragment links into markers, and :target-current selects the link associated with the active target. Scroll the compact track or follow its links. Browsers without native support use an Intersection Observer fallback, with the status shown beside the specimen. Learn more in MDN’s scroll-target-group reference and the CSS Overflow specification.

Section A

Scroll the track or follow the links.

Section B

The current marker reflects this section.

Section C

Native CSS or an announced fallback keeps it current.

scroll-target-group: auto; · a:target-current

Checking native scroll marker support…