[DropdownMenu]: Style applied to the body[data-scroll-locked] messes up position: sticky on the child elements

[arpitdalal]

Opening the Radix DropdownMenu makes a div with position: sticky; relative again for some reason. I wasn't able to reproduce this, so probably it's not a bug. But I am lost, where would the problem lie?

If I override the overflow: hidden behavior on body, then it works fine.

Screen.Recording.2024-05-02.at.9.24.06.AM.mov

[sasicodes]

+1

[lorekadam]

Hi, on the DropdownRoot try to set a modal={false} prop. It should help :)

[IgorKhomenko]

you saved my day.
I used https://ui.shadcn.com/docs/components/dropdown-menu and when trigger dropdown, the body becomes fully hidden in my app. Totally unclear...

[rishavanand]

Issue gets resolved with modal=false but that's only for dropdown. What if I want to use the modal itself with the backdrop? @lorekadam

[mikecreuzer]

+1

[Hexi1997]

+1

[abdulfattahaud]

+1
On the Popover component, it doesn't work, and neither does this modal={false}.

[braginteractive]

Anyone figure this out? Setting the modal to false doesnt seem to fix it either