In Chrome and Edge, backdrop-filter only blurs the content directly behind an element, not its children. This means that if your dropdown is placed inside a blurred navbar, it cannot “see” past the navbar’s background to blur the page content. While Safari and Firefox handle this as expected, Chrome and Edge fail because the dropdown is trapped within the navbar’s stacking context. The most reliable fix is to render the dropdown outside the navbar—either as a DOM sibling or via a React Portal to document.body—and position it absolutely beneath the trigger button so it can blur the page background directly. If you must keep it inside the navbar, give the dropdown its own semi-transparent background with backdrop-blur-lg (plus will-change: backdrop-filter and -webkit-backdrop-filter for WebKit) and ensure no ancestor has overflow: hidden or transform.