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.

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

Move heading anchors 50px up to avoid nav bar #448

Merged
merged 1 commit into from
Oct 28, 2013

Conversation

sophiebits
Copy link
Collaborator

Fixes #447.

We do this by moving the actual anchored element up in the page without moving the actual text. (Apple uses a similar trick in their framed docs.) Now this looks a bit sillier on smaller screens but it's better overall.

Before:

image

After:

image

@zpao
Copy link
Member

zpao commented Oct 28, 2013

Let's put the 50px into a variable so this gets updated automatically if we change the navbar height.

Fixes facebook#447.

We do this by moving the actual anchored element up in the page without moving the actual text. (Apple uses a similar trick in their framed docs.) Now this looks a bit sillier on smaller screens but it's better overall.
@sophiebits
Copy link
Collaborator Author

Okay, done.

top: -$navHeight;
}

> a {
Copy link
Member

Choose a reason for hiding this comment

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

I don't think we need the > (since we shouldn't have anything but anchors as children) but whatever…

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.

Docs nav header behaviour on different screen sizes
2 participants