DEV Community

Heidi Fryzell
Heidi Fryzell

Posted on • Edited on

2 2

HTML Same Page Links

https://heidi37.github.io/dev-playground/days/4/4.html

Today I added top navigation that links to anchors within the page. I was having a little trouble with the links as they were jumping to the correct content but the content was falling behind my header.

I found this stackoverflow that helped tremendously.

The bottom line was, use anchor tags, don't link to ids on existing elements. And then put an "anchor" class on those anchor tags with the following CSS applied.

a.anchor {
    display: block;
    position: relative;
    top: -250px;
    visibility: hidden;
}
Enter fullscreen mode Exit fullscreen mode

day 4

Top comments (0)

Qodo Takeover

Introducing Qodo Gen 1.0: Transform Your Workflow with Agentic AI

Rather than just generating snippets, our agents understand your entire project context, can make decisions, use tools, and carry out tasks autonomously.

Read full post

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay