Skip to main content

Anchor links issue

Faye Styles

Hello Brizy Support,

I am trying to implement anchor links for a table of contents on one of my pages, but I am encountering an issue with how the page scrolls to the anchored sections.

My site uses a sticky header/menu, and when the page scrolls to the anchor the heading of the section ends up partially hidden behind the header. It looks like the scroll position does not account for the height of the fixed header.

I attempted to solve this using CSS offsets (such as scroll-margin-top and the :before spacer technique), but these do not seem to affect the behaviour when using Brizy block anchors.

Could you advise on the recommended way in Brizy to offset anchor scroll positions when using a sticky header without having large gaps on my page from using margins as that isn't going to work as a solution on this page? For example:

  • Is there a built-in anchor offset setting?

  • Is there a recommended CSS selector for block anchors created via the Block ID field?

  • Or is there another approach you suggest when using a table of contents with anchored sections?

Any guidance would be appreciated!

Thank you.

0

Comments

1 comment

Date Votes
  • KC George

    Hello Faye,

    Have a look at https://jmp.sh/Dfb8LJA7 where I demonstate how you can add anchor links to blocks and ensure that it displays just below the sticky header.  

    0

Please sign in to leave a comment.

Didn't find what you were looking for?

Ask a Question