Describe the bug
The alert component creates a positioned container element (.usa-alert__body) that creates a new offset frame. The in-page navigation component then inserts an anchor inside the alert component. When clicking the link in the in-page navigation, it uses the anchor's offsetTop, which is the vertical distance between the selected element and its nearest offset parent. In this case, it's nearest offset parent is the alert container, not the page body itself.
Steps to reproduce the bug
- Browse to https://handbook.tts.gsa.gov/tools/git-signing
- Click
About the cryptographic algorithm in the in-page nav
- Note that the page scrolls to the top rather than to the linked heading
Expected Behavior
The browser should scroll to the selected heading, perhaps using getBoundingClientRect instead of offsetTop since the former computes absolute values (relative to the page, not any other elements in the tree).
Related code
https://github.com/uswds/uswds/blob/main/packages/usa-in-page-navigation/src/index.js#L202
Screenshots
No response
System setup
- USWDS version: 3.11.0
- All browsers
Additional context
Possibly related to:
Code of Conduct
Describe the bug
The alert component creates a positioned container element (
.usa-alert__body) that creates a new offset frame. The in-page navigation component then inserts an anchor inside the alert component. When clicking the link in the in-page navigation, it uses the anchor'soffsetTop, which is the vertical distance between the selected element and its nearest offset parent. In this case, it's nearest offset parent is the alert container, not the page body itself.Steps to reproduce the bug
About the cryptographic algorithmin the in-page navExpected Behavior
The browser should scroll to the selected heading, perhaps using
getBoundingClientRectinstead ofoffsetTopsince the former computes absolute values (relative to the page, not any other elements in the tree).Related code
https://github.com/uswds/uswds/blob/main/packages/usa-in-page-navigation/src/index.js#L202
Screenshots
No response
System setup
Additional context
Possibly related to:
Code of Conduct