Feedback - The anchor links stops at a position different from the demo video

[rjekic]

Type of feedback

//content

Description

Content URL:
https://learn.wordpress.org/lesson/use-wordpress-to-create-a-one-page-site/

Are you reporting an error or providing other feedback?
Reporting an error (such as outdated information)

What are you reporting? :
The anchor links stops at a position different from the demo video.
It seems like the opaque sticky header covers the exact anchor destination.
But the video omits the explanation as to how to fine-tune anchor destination in such situations.

Note: error reported by user hwajune5834

[Bigod]

Feedback Validation Checklist:

• If this is reporting an issue, can you confirm/reproduce the issue? (Yes or No): Yes
• What should happen next to apply the feedback?: See below feedback

What should Happen

• I can confirm the issue mentioned: when navigating to an anchored section using the sticky header, the top of the content is hidden behind the header. This behavior is not visible in the video because the sections have enough top padding, so the issue doesn’t appear in that example.

• A possible solution would be to add scroll-margin-top to the target elements (e.g. headings or sections) to offset the sticky header height, for example:

.scroll-target {
  scroll-margin-top: 80px; /* adjust to header height */
}

So the video could be updated to reflect this behavior, or the lesson page could include a short note or code snippet explaining how to adjust for sticky headers, so learners are aware of this difference and can adapt their sites accordingly.

@WordPress/learn-editors @rjekic