search

reactjs / react-autocomplete

WAI-ARIA compliant React autocomplete (combobox) component
MIT License
2.17k stars 532 forks source link

The autocomplete menu is positioned wrongly when the container has a transform css rule #323

Open elvinfucom opened 6 years ago

elvinfucom commented 6 years ago

I put autocomplete component in a react modal, which is centered by transform css rule: transform: translate(-50%, -50%);

Then autocomplete menu displays at wrong position without consider the transform. Anyone knows about this?

markmssd commented 6 years ago

Hey @elvinfucom , did you figure this out?

I noticed the menu gets a position: fixed style based on its current position, which also makes it hard to align it to the right.

elvinfucom commented 6 years ago

@markmssd yes, I made a workaround finally. Instead of fixing the autocomplete menu, I fixed the react modal by overwrite transform to disable it. Then the menu works well.

Natedeploys commented 6 years ago

I fixed this by replacing transform in the parent div / container with another centering method