Perfect anchor scrolling: Eliminate overlaps with Scroll Margin Top!

[@heikodietze]

I'm sorry to hear that, Tariq. What you could do is post your HTML and css to ChatGPT and ask for debugging it. It even could work with a screenshot of the html structure from your browsers dev tools. If you haven't tried that already.

[@TariqKhan-wp4in]

Thanks Again Heikodietze.

[@heikodietze]

@@TariqKhan-wp4in my pleasure!

[@EricFaizullah]

I cannot understand the select %root%.

[@heikodietze]

Eric, you mean, why you have to write %root% {} there or something else?

[@TariqKhan-wp4in]

it did not worked in my case. I have one column sticky and containing links to the sections on the other column. the scroll-margin-top did not worked.

[@heikodietze]

@TariqKhan-wp4in - Thanks for your comment! I'm sorry to hear that the scroll-margin-top property didn't work in your case. Unfortunately, it's difficult to help with such specific issues remotely. I recommend you to record a short video (e.g. with ‘Loom’) and post it in the Bricks Community forum under the ‘How to’ section with your question. That way, I and other helpful members can get an idea and probably help you further. Is that an idea?

[@TariqKhan-wp4in]

@@heikodietze Many thanks for your valuable comment and time. actually this issue often happens with elementor and the scroll margin top does not work as usual. So I fixed it with the js code. I am posting the code here if if can help others. window.addEventListener('elementor/frontend/init', function() { elementorFrontend.hooks.addFilter( 'frontend/handlers/menu_anchor/scroll_top_distance', function(scrollTop) { return scrollTop - 253; }) })

[@heikodietze]

@@TariqKhan-wp4in Great! Thanks a lot also for posting your code! 👍🏻