SelectOption element does not adapt to the Select parent element

[bekell]

Describe the bug; what happened?
Setting the width of the Select element to be smaller, or when the select element resizes due to the window becoming smaller doesn't affect the SelectOption elements. Instead, the SelectOption elements remain their default size.

Also, on a scrollable page, the SelectOption list is set to the original location of the Select element instead of the current position.

Lastly, the dropdown list of options goes behind other UI elements.

What are the steps to reproduce the issue?
I was able to repro this by resizing the window and then opening the dropdown here: https://explore.fastdna.net/components/select/

I was able to repro the scroll issue by adding multiple Select elements with children, scrolling down the page, and then trying to open the select element.

[scomea]

Was able to repro the resize issue on the development site but it looks to be fixed on the more up to date staging site - https://explore-stage.fastdna.net/components/select/
The "explore.fastdna" site is lagging as we are deprecating it. Are you able to repro the resize issue in your code with an up to date version of fast-dna?

[scomea]

@bekell - can you share code for scrolling issue? Unable to repro.

[scomea]

Found what may be an unecessary z-index setting on the select menu style. Investigating if we can remove it.

[bekell]

@scomea I updated our project to the latest and it fixed issue 1 & 2. The third issue (dropdown behind other elements) still exists, but looks like you may have found a solution.

Thanks!

[scomea]

Checked in a fix that removes the zindex attribute from the select menu