Anchor link with a fixed header

If you have an anchor link on a page with a fixed header, the element linked to will disappear behind the fixed header. To fix this, you will have to add an invisible element before the element you are linking to with a height of the fixed header.

Here is an example element for a header with a width of 80 pixels:

:before {
    content: "";
    display: block;
    height: 80px;
    margin: -80px 0 0;


Passion for sports with boards, climbing, mountain biking, traveling, photography, videography and software engineering. /n/n Heilbronn // Germany

Leave a Reply