eniac314
commented
7 years ago I am having some problems too with the select menus done with Element.Input.dropMenu and Element.Input.search
In Firefox when I put two select fields one on top of the other in a column the dropdown menu from the top one is obscured by the select field from the bottom one (seems like a z-index problem). Moreover, I can't find a way to get rid of the ugly dotted outline that frames the dropMenu. It takes the whole container width, no matter the width of the input field.
Curiously using : focus [ prop "outline" "none"] seems to work only for Element.Input.search but not for Element.Input.dropMenu
Chrome seems to be even worse. I am seeing the full height issue you mentioned. A running example is visible here: https://ellie-app.com/fSGnCmdB3a1/1, it is adapted from the form example on the github page.
The big picture of what I'm trying to do
Use a select with a dropdown.
What I did
The following Ellie: https://ellie-app.com/cVxGzYRWBa1/5
What I Expected To Happen
I expected to have a default, normal, simple, bland-looking select =)
What Actually Happened
The default size for the "dropdown" fills the entire screen and pushes the options "below the fold".
*: Interestingly, it seems that this version of the Ellie does not suffer from issue #107. Could it be that it's the sizing of the dropdown that causes problems?
**: Also interestingly, and also unlike issue #107, this is NOT happening on Firefox (the select is of a standard size). However, on Firefox, issue #107 is occurring on that Ellie.
Versions