First click on link scrolls to incorrect position

[dalalRohit]

I have a navbar with 4 links with their scroll-to-component (to) and all other props defined. When I click any of the link for first-time after a page refresh, it takes me some few pixels down than the actual component. I have also set up offset for each link, still for the first time when I click on any link, it takes me to the incorrect position. After the first click, it behaves as expected and scrolls to perfect component. Why is it for only the first link click? Not getting any clue.

Any help will be highly appreciated. Thank you ;)

[ckeeney]

I experienced the same behavior, but it turned out that the first child of the target scroll-to-component had a top margin. Removing this top margin solved the problem for me.

[dalalRohit]

I experienced the same behavior, but it turned out that the first child of the target scroll-to-component had a top margin. Removing this top margin solved the problem for me.

I'm still not able to solve this. I don't have any margin-top on the target element. Still, it takes me a few pixels down the intended position. Not sure why this is the case

[sharifhimu]

I am having similar problem also but i am getting it on every click . I don't know why.

[slemke]

I had the same issue and it turned out that my wrapper element (wrapping the target element) had negative top margin which effected the scrolling behavior. After I removed the negative top margin it worked.