Limited support Limited browser support. Check compatibility before use.

scroll-target-group

Experimental: This is an experimental technology

Check the Browser compatibility table carefully before using this in production.

The scroll-target-group CSS property specifies whether an element is a scroll marker group container.

Scrolling

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
scroll-target-group
Experimental
140
140
140
auto
Experimental
140
140
140
none
Experimental
140
140
140
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)

Syntax

CSS 
.toc {
  scroll-target-group: self;
}
.toc a:target-current {
  font-weight: bold;
  color: #3498db;
}

Live demo

tochilight

CSS tochilight demo.

PreviewFullscreen

tab style nav

CSS tab style nav demo.

PreviewFullscreen

Sidebar

CSS sidebar demo.

PreviewFullscreen

Use cases

  • Using scroll-target-group

    Experimental: This is an experimental technology

Cautions

  • Limited browser support. Check compatibility before use.

Accessibility

  • Make sure visual changes are conveyed appropriately to assistive technology.

Related links