offsetting an html anchor to adjust for fixed header code example

Example 1: page anchor tag below header

// For modern browsers, just add the CSS3 :target selector to the page. 
// This will apply to all the anchors automatically.
// ref: http://stackoverflow.com/a/21707103/6220029

:target {
  display: block;
  position: relative;
  top: -120px; 
  visibility: hidden;
}

Example 2: offset anchor tag when scrolling

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

Example 3: offset anchor tag when scrolling

<a class="anchor" id="top"></a>

Tags:

Css Example