Safari not showcasing content properly

Design help Experimental browsers
1

Hello,

I’m experiencing an issue with a transition effect in a section we built on Webflow. The transition is designed to start with a grayish font color on a black or carbon background. As the user scrolls down, the background should transition to white with a harsh borderline, and the font color should change to black, resulting in black text on a white background.

However, I’ve noticed that on Safari, this transition doesn’t seem to work as expected. While it starts correctly with a black background and white text, as I scroll down, the font color doesn’t switch to black as it should. The white text remains, making it hard to read on the white background.

I’m unsure of what might be causing this issue. Could someone from the forum help me understand why this is happening and suggest a possible solution?

Thank you for your assistance!

Here is my site Read-Only:https://preview.webflow.com/preview/elenadecobre?utm_medium=preview_link&utm_source=designer&utm_content=elenadecobre&preview=bab4174c9c3b6bf3afa944f2126bf3c4&workflow=preview

2

Hi there,

Did you buy the template or developed it from scratch ?

You may need to look if the CSS-property you are using for the background color + Typography effect is supported on Safari. You can check if it is supported in the following webpage: https://caniuse.com/

3

Hello @juanj23. Thanks for your answer.

we did not use any template. It was completely designed from scratch. I am failing to understand/isolate the exact css property I need to check. Sadly it is not very clear.