CSS backdrop-filter not working as expected

Question

we were successfully able to apply backdrop-filter to our navigation bar. But on mobile devices, where the navigation bar is collapsed, we are showing the traditional drop-down navigation menu. When applying the filter to the drop-down menu div it's ignoring the blur and simply not showing it. The weird part is that if we switch off the blur on the navigation bar itself, it'll work. Here is a screenshot of the issue:

Note, the website is live. Please visit socialkit.com to investigate further.

Answer 1

It's a bug in Chrome, https://bugs.chromium.org/p/chromium/issues/detail?id=993971 Check this post, they suggest a workaround backdrop-filter not working for nested elements in Chrome