Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add scroll-margin-top rules for #links #1851

Open
benlk opened this issue Mar 7, 2020 · 0 comments
Open

Add scroll-margin-top rules for #links #1851

benlk opened this issue Mar 7, 2020 · 0 comments
Labels
category: feature add New/added features category: styles affects lots of styles, requiring visual testing Estimate: < 2 Hours priority: low Nice-to-have in a release. type: feature request

Comments

@benlk
Copy link
Collaborator

benlk commented Mar 7, 2020

https://css-tricks.com/fixed-headers-and-jump-links-the-solution-is-scroll-margin-top/
https://developer.mozilla.org/en-US/docs/Web/CSS/:target

Since we know the height of Largo's sticky nav, we can do something like:

:target {
    scroll-margin-top: @stickyNavHeight;
}

This prevents the sticky nav from covering the element that is being scrolled to.
@benlk benlk added priority: low Nice-to-have in a release. type: feature request category: styles affects lots of styles, requiring visual testing Estimate: < 2 Hours category: feature add New/added features labels Mar 7, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
category: feature add New/added features category: styles affects lots of styles, requiring visual testing Estimate: < 2 Hours priority: low Nice-to-have in a release. type: feature request
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@benlk