Certain divs overlapping the fixed header on Safari browsers

Hello.
I can’t seem to understand why is one of my sections overlapping with my fixed header.
This seem to only happen on Safari browsers.

Can anyone help me out?

Here is a screenshot:
asgdf|672x500


Here is my site Read-Only: LINK!

Hi

The read only link and the screen shot are not looking the same… did you fixed the problem>?

Nope. There’s only a problem while viewing the page using Safari (you can view it live here: https://sept-lab.webflow.io/)

Safari - on my side:

This is not the part where it gets bugged.
Scroll down a little bit and you’ll see it happening on the next section.

Quick edit: you can see the exact part where it happens on the screenshot which I attached in the initial post.

Anyone? I’m already out of my schedule and would really appreciate some help.

Hi

I really trying to help you :slight_smile: but I don’t know what do you need. Attach A video showing that everything just fine when scrolling down.
https://www.loom.com/share/7b94d085360140e5a49c70455fe03a92

This is very strange as my friend who uses a mac sees the bug and I see the same while testing the website on lambdatest.com.

Recording: septlab_bug

After a few days of trying to solve this, I decided to turn off children perspective on the Product Nature Showcase Parallax div and place a standard non-animated div instead and everything is working flawlessly thus it appears there’s a problem with either Children Perceptive or with transform settings of inner divs.

So no animation for this website, but at least it works.

1 Like