To see the problem, select something in the lower field, then try to select something in the upper field. The upper field's dropdown menu is displayed underneath the lower field, so that you can't select anything in the overlapping part of the menu.
(Note that this example also exhibits the problem described in #108, but that's not what this one is about.)
What I Expected To Happen
Dropdown menus should have "topmost" Z order, so that they are displayed above all other elements on the page.
What Actually Happened
The Z order of dropdown menus appears to be interspersed with the Z order of "normal" elements.
The big picture of what I'm trying to do
I'm trying to use two select elements with dropdown menus, one above the other.
What I did
A working example is here: https://ellie-app.com/mSyCvb65La1/0
To see the problem, select something in the lower field, then try to select something in the upper field. The upper field's dropdown menu is displayed underneath the lower field, so that you can't select anything in the overlapping part of the menu.
(Note that this example also exhibits the problem described in #108, but that's not what this one is about.)
What I Expected To Happen
Dropdown menus should have "topmost" Z order, so that they are displayed above all other elements on the page.
What Actually Happened
The Z order of dropdown menus appears to be interspersed with the Z order of "normal" elements.
Versions