Webflow sync, pageviews & more.
NEW
Answers

Is there a bug in Webflow causing the backdrop filter to not work on Safari? Others are experiencing the same issue, as shown in the attached images in both Safari and Chrome. The blur effect should apply to the "local-nav_container" div.

I apologize for any inconvenience you're experiencing with the backdrop filter not working on Safari in Webflow. While I can't provide specific information about bugs, I can give you some general insights that may help troubleshoot the issue.

1. Compatibility: Backdrop filter is a CSS property that is supported in modern browsers, including Safari. However, sometimes certain versions of a browser may have limited support or specific bugs. Hence, it's crucial to check the compatibility of the backdrop filter with the Safari version you're using. You can visit caniuse.com to determine the browser support for backdrop filter in different versions of Safari.

2. Prefixes: Sometimes, CSS properties require vendor prefixes to work properly in different browsers. However, backdrop filter is a non-standard property, and the vendor prefixes are not required. Nevertheless, it's worth ensuring that you haven't accidentally added any prefixes specifically targeting the backdrop filter property in your custom code.

3. Container Elements: Ensure that the "local-nav_container" div is correctly targeted with the backdrop filter property. Check the styles applied to the div and ensure there are no conflicting styles or overriding rules that might prevent the backdrop filter from working as intended.

4. Stacking Contexts: Backdrop filter may not work as expected due to stacking contexts. If the "local-nav_container" div has a parent element with a higher z-index or a different positioning property, it may affect the visibility of the backdrop filter. Try adjusting the z-index values or changing the positioning property of the parent element to see if it resolves the issue.

5. CSS Rendering Bugs: Web browsers occasionally have rendering bugs that may impact the display of certain CSS properties. Checking for any reported issues specific to backdrop filter in the version of Safari you're using could be helpful. Additionally, ensure that you have the latest browser updates installed, as they often include bug fixes.

If none of these suggestions resolve the backdrop filter issue, I recommend reaching out to Webflow support or the Webflow community forums for more specific assistance. Providing them with additional details such as your Safari version, URL to the site, and any custom code you've implemented can help them investigate the problem more effectively.

Rate this answer

Other Webflow Questions