Backdrop filter

[Omar_melki]

Hey guys

Hey guys

I need your help in troubleshooting this bug.
So I am applying a backdrop-filter inside a custom embed code “global CSS”.
The element is called “c-category_overlay” to which I am applying the effect. The problem is that it’s working on all of them and not the first item - its one div since it’s inside a cms collection - so how it’s working on all of them and not the first one since it’s the same element

Here is a screenshot of the designer where you can see the effect taken place in the second block and the ones below - click on the share link below to see the rest plz -

and here is the backdrop filter code inside the “global css” embed code

https://preview.webflow.com/preview/deutschol?utm_medium=preview_link&utm_source=designer&utm_content=deutschol&preview=2503471cca097cd79a9965123d51626e&pageId=5ed63dd590a96ba882ea73ab&mode=preview

I would appreciate it if anyone can help me troubleshoot this issue.

Thanks…

[Stan]

hi @Omar_melki it can be some glitch in WF (not sure) on Chrome because in Safari all works well. I want to mention only one thing that backdrop-filter is supported ONLY with Safari (WebKit) and Chrome (V8) so you should have some fallback for unsupported browsers as Firefox (SpiderMonkey).

CANIUSE

[Omar_melki]

Hi @Stan thx for reaching out - I don’t think that is the issue because the screenshots are coming from chrome so why does the effect as shown is working on all blocks and not on the first one

[Stan]

I have created simple WF project just to see if filters works and they work as expected (safari & chrome) So I have no Idea why it happened