Hi, I try to connect a grid of (nine) “cards” (blocks that are set up as links) with an accordion with nine tabs. The goal is that when the user clicks on a card the viewport scrolls to the corresponding accordion tab. And that tab should be expanded.
To set this up I gave every accordion item an id. Than I set up each card (block) as an external link with the id (and a hashtag) of the corresponding according at the end.
Now I have a problem that I can’t find a solution for: When I click on a card the viewport scrolls to the corresponding item. But sometimes the item is expanded and sometimes it is collapsed. And when it is expanded sometimes the viewport scrolls to the start of the item (which is the behaviour that I want) and sometimes it scrolls to the middle or even further down in the item. And all this seems to happen randomly. Sometimes it works, sometimes it works a little and sometimes it don’t work at all like it should.
Has anyone an idea why this is and how to fix it? Any help is highly appreciated.
Here’s the section I’m referring to:
https://lenaschwabe.marcrodenberg.com/#behandlungsspektrum
Browser: Chrome 110
OS: Windows