Zindex error for this component

[RuddyReisberg]

Hello,

I want to see myCompnentReactSearchAutocomplete in my front but it is blocked by an other. Please, see the join.

Thanks you very much

[sickdyd]

Hello RuddyReisberg,

apologies for the late reply. Could you provide an example on CodeSandBox or similar? https://codesandbox.io

The first thing I would try is to wrap the search boxes in a <div> with increasing z-index. Something like:

<div style={{ zIndex: 2 }}>
  <ReachSearchAutocomplete />
</div>

<div style={{ zIndex: 1 }}>
  <ReachSearchAutocomplete />
</div>

Let me know if this helps!

EDIT: I edited my reply since the indexes were inverted!

[raikk]

@sickdyd I have same issue here. Even I wrapped in div with zIndex 4, still can't. See this, please suggest where to make able to modify styling of this module??

[raikk]

Ohh... got it. We have to use styling

<ReactSearchAutocomplete
   styling={{backgroundColor: '#fff', 
zIndex: 2, 
placeholder: 'Type Country',
 placeholderColor: "#939294", 
borderRadius: "2px", 
height: "35px"}}   
...
/>

Thanks @sickdyd for this great module.