0

I found a ton of articles how to fix the offsets for anchors if you have a fixed header. Most of them are similar to this 

.anchorclass:before {
content: "";
display:block;
height: 204px; 
margin: -204px 0 0;
visibility: hidden;

}

All variants I found work for the problem. But they all seem to somehow overlay over the 204 pixel before the anchor, which render all the links and buttons in this area unclickable. So link, followed by anchor within 204 pixel -> cannot click.

I tried to fix this with z-index: 0 which does not work either. I could not find a solution for this, not even somebody having the same issue

Edit:

I thought this is very common sorry. Base problem is that if you have any fixed header and jump to an anchor on the page, the anchor is hidden behind the header, ie jumping to anchor counts from top, not from the fixed header.

Here are links that explain the problem in detail, there are thousands of results googling "offset anchor fixed header" describing problem and solution above

Fixed page header overlaps in-page anchors

https://www.caktusgroup.com/blog/2017/10/23/css-tip-fixed-headers-and-section-anchors/

https://timoanttila.com/tutorials/offsetting-anchor-links-with-fixed-header

Solutions are all similar as explained above. But nobody describes the behavior i have, that all links in the offset are rendered unclickable. I dont know what sample code to add. Any fixed header, any anchor will produce the problem.

WaxL
  • 55
  • 1
  • 10
  • Can you add your HTML markup? The remaining CSS for the header? – BugsArePeopleToo Aug 23 '19 at 21:12
  • Sorry, i dont saw this as relevant. header is position fixed, top 0, height 204 px. wherever there is an anchor in the long pages, all elements 204 pixel before that are not clickable – WaxL Aug 23 '19 at 21:16
  • 2
    Your description doesnt make sense without seeing the structure. I actually still dont know what you mean by "offsetting anchors". – BugsArePeopleToo Aug 23 '19 at 21:26
  • I'd have to agree, that class in your example looks like a really unnecessary hack used in place of understanding good 'ol fashioned box model. If you show us what your trouble is with more context I'm betting it's much simpler than you think. – Chris W. Aug 23 '19 at 21:29
  • what do you mean by "I found a ton of articles" I can not find any, if there are so many, why not show at least one example? – Mister Jojo Aug 23 '19 at 21:34
  • Very sorry, I did not post here often before. I tried to add info for clarity – WaxL Aug 23 '19 at 22:06

0 Answers0