Thanks for using react-select!

If you are going to ask a question or want to propose a change or a new feature, then please don't file an issue for this.
Questions and feature requests have their own place in our discussions section.

Are you reporting a bug or runtime error?

A bug. No matter what I try, looking back at the examples nor at the previous issue queue, I cannot affect z-index whatsoever.

Code is fairly standard:

const modelSelector = [
  { value: 'Ferrari 812 GTS', label: 'Ferrari 812 GTS' },
  { value: 'Ferrari 296 GTB', label: 'Ferrari 296 GTB' },
  { value: 'Ferrari 296 GTS', label: 'Ferrari 296 GTS' },
]

const ModelSelector = () => (
  <Select options={modelSelector} placeholder="Model" />
)

I've tried all sorts of style stuff, like this:

const customStyles = {
  option: (provided: any, state: any) => ({
    ...provided,
    zIndex: 999,
  }),
  control: () => ({
    zIndex: 999,
  }),
  singleValue: (provided: any, state: any) => {
    const opacity = state.isDisabled ? 0.5 : 1
    const transition = 'opacity 300ms'

    return { ...provided, opacity, transition, zIndex: 99999 }
  },
}

No luck.

This is in a React Native Web application, if that makes any difference.

How do I get z-index to work? If I put the z-index of everythingI want underneath the dropdown to -1 it works, but that's obviously not a great solution