Skip to content

[css-overflow-5] Add an example for 'scroll-target-group' property#12449

Merged
danielsakhapov merged 2 commits into
w3c:mainfrom
danielsakhapov:scroll_target_group_example
Jul 4, 2025
Merged

[css-overflow-5] Add an example for 'scroll-target-group' property#12449
danielsakhapov merged 2 commits into
w3c:mainfrom
danielsakhapov:scroll_target_group_example

Conversation

@danielsakhapov

Copy link
Copy Markdown
Contributor

As requested in Intent to Ship thread:
https://groups.google.com/a/chromium.org/g/blink-dev/c/R_VD_FkYrF8/m/XDzix9lbAwAJ adding an example to show how to use 'scroll-target-group' property to highlight the currently visible chapter within a table of contents.

As requested in Intent to Ship thread:
https://groups.google.com/a/chromium.org/g/blink-dev/c/R_VD_FkYrF8/m/XDzix9lbAwAJ
adding an example to show how to use 'scroll-target-group' property to
highlight the currently visible chapter within a table of contents.
@danielsakhapov danielsakhapov requested a review from flackr July 4, 2025 12:05

@flackr flackr left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good but I left some suggestions to make it a bit more concise.

Comment thread css-overflow-5/Overview.bs Outdated
color: blue;
display: block;
padding: 10px;
text-decoration: none;

@flackr flackr Jul 4, 2025

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

not necessary but for the purposes of an example you could probably skip most of this styling, i.e.

  1. display: block isn't necessary if the links are in a block element, commonly table of contents are a <ul> or <ol> with <li> wrapping each of the links (the structure of the spec table of contents itself).
  2. Links are normally blue anyways right?
  3. In a structured list, padding wouldn't be necessary on the link tag.
  4. Hiding the link text decoration seems like an optional thing.

TLDR I think you should remove this block completely, change #toc to an <ol> element and wrap each of the <a> elements in a <li>.

Updated: Sorry my comment got a bit mangled but it looks like you got it :-)

@danielsakhapov danielsakhapov merged commit eb4e1f7 into w3c:main Jul 4, 2025
1 check passed
@danielsakhapov danielsakhapov deleted the scroll_target_group_example branch July 4, 2025 13:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants