Fixed page header overlaps in-page anchors

Question

If I have a non-scrolling header in an HTML page, fixed to the top, having a defined height:

Is there a way to use the URL anchor (the #fragment part) t

Answer 1

I had the same problem. I solved it by adding a class to the anchor element with the topbar height as the padding-top value.

Bar

And then simply the css:

.anchor { padding-top: 90px; }