I’m facing an issue connected to the overflow hidden property. It’s rather hard to explain, so I’m just gonna show.
On the website https://actinius.webflow.io I have a nav-menu in place which links to sections on the homepage. If I am using the nav-menu from the homepage itself, everything works perfect; I get scrolled down to the correct section and all interactions load.
However, when I’m on a different page (let’s say https://actinius.webflow.io/icarus) and I click on the “technologies” link in the nav-menu, the whole hero-section of the website is vanished once I’m redirected to the homepage.
I’m pretty sure this has to do with the div wrapper around the first three section (hero, ‘what we do’ and ‘technologies’), with the property set to overflow-hidden. However, I’m just not sure how I could solve this problem. Does anyone have experience with this?
Good question; the moving circle on the background will float outside the body, causing a horizontal scroll, hence the wrapper with the overflow hidden property.
Removing the overflow property does indeed work, it works as expected. However, once I set the overflow to hidden, it breaks again, even with a minimum height.
The weird thing is that even the browser inspector says the height of the hero section is ~1200px (100vh), but in reality it only shows like 400px. this is such a weird bug!