Scrolling is going past the ID

In the global area is the Nav Menu. I’ve setup IDs on different blocs. In the Nav Links I chose ID under interaction. Uploaded the website. In the Browser I click the link and it quickly scroll down past the ID I set up. How can I get the scroll down to stop at the top of the bloc?

I’m not much help here @KBConcepts, but I find the scroll to target a bit hit and miss.
I’ve had varying success with adding extra padding and/or margins to either the specified bloc or the one above or below, but not always!

Try disabling lazy load if you have it on.

Unfortunately this doesn’t help.
I never used lazy load and I gave up trying to solve the scroll to target problem.
I leave the problem to the user :rofl:

thanks for the suggestion, but I do not use it.

Add a class to the bloc in question and give it the attribute scroll-margin: 65px;

Play around with the pixel value.

5 Likes

Thanks @pumpkin

I didn’t know about this one. Excellent. :smiley:

1 Like

The magic that is Google :grin: Plus, I used it just recently. I wish that adding a separate class to adjust the scroll position wouldn‘t be necessary though.

2 Likes

See if this works. In Menu Manager, use Navigate to URL for the Type. Set URL to #ID you set on the page for that bloc, example #middle. The bottom bloc may not be correct if the page isn’t long enough.

Thank you :smile: I just got back into town, or I would have returned a reply earlier.

interesting thought, thanks for your reply

Hi @pumpkin, can you maybe explain step by step how to do this?

I was trying to create a demo project for you, but somehow the scrolling to target worked out of the box without any offset. And adding the css didn’t change that. Hm… :thinking:

The style requires snap position on the parent container.

Blocs does have a scroll to script. I’ve had issues with the offset before. One site I just added my own scroll to script :joy:

1 Like