Anchor Link's Lead to Wrong Position only on Mobile Devices - Webflow Solutions Attempted

Hello Webflowers!

My anchor links are scrolling to the wrong position on first load. After first load the links all work as intended. This is ONLY MOBILE DEVICES (tablet & below/chrome & safari), works great on desktop. All the mobile screen size links work when using an emulator in an incognito window.

I don’t believe it’s a spacing issue as I have the layout adjusted for the sticky nav bar & it is spaced exactly as intended in an emulator.

Attempted solutions:
Compress images - already compressed
Auto load images - did not work
Eager load images - did not work
Change selector of div block to same name as ID - did not work (not sure why it would)
Change body to overflow: auto - did not work
Change navigation to fixed instead of sticky - did not work

I’m sure it’s one of those things one misses after staring at the same project for a month straight, so a new set of eyes would be most helpful!

Here is my site Read-Only: LINK
Live Site: Synergetic Home
(how to share your site Read-Only link)

Anyone out there? :sweat_smile: I know in the read only link most of the id’s don’t match. I recently did some testing. The single/double hung link is correct, just to show how it looks when it’s not working.

Hey @Indigo, I’, facing same trouble. Any luck to solve it? Anyone else there faced same problem by any change?

Any solutions? Facing the same issue here. I’ve done all of the same fixes that @Indigo listed to no avail.

It’s entirely up to the browser whether the image is pre-loaded.
Mobile browser may not, to conserve bandwidth and memory.

You could try giving your images specific sizes or at least heights, so that the browser can calculate your scroll to position.