[remram]

Couldn't it be anchored to the page? Instead of anchored to the screen and require repositioning?

Is there a limitation in CSS preventing it?

[paulddraper]

The problem is the drop-down should never be cropped/hidden by the boundary of a parent container.

This runs counter to the behavior of it being anchored to a parent container.

[happytoexplain]

Are you saying that you can only anchor an element to one of its ancestors? Can CSS really not define positional relationships between siblings (I'm used to Apple's Auto Layout)? If so, couldn't you add an additional outer container that doesn't crop its contents to its bounds and anchor the dropdown to that?

[paulddraper]

The problem is when your dropdown component (D) is in a scrolling container (2) in the page (1).

    -1-----------
    |           |
    |  -2---    |
    |  | D |    | 
    |  -----    |
    |           |
    -------------

If you attach the dropdown options to the inner container (2), they are cropped.

If you attach the dropdown options to the outer container (1), they don't scroll with the rest of their component (D).

----

Non-native dropdowns in general are handicapped.

For Windows/MacOS/Linux, native dropdowns can exceed the bounds of even the OS window. There is no CSS equivalent of this behavior.

[devongovett]

If you have a trigger inside a nested scrollable region, and the popover pops out of this region, then if the trigger is scrolled out of view the popover cannot be anchored to it anymore.