react-virtualized icon indicating copy to clipboard operation
react-virtualized copied to clipboard

Cell's with dropdown menus can be cut-off by the Grid's inner container

Open jkells opened this issue 6 years ago • 3 comments

What is the current behaviour?

When a cell in the Grid contains a custom drop down menu component, the drop down menu is cut-off by the inner scroll container regardless of the size of the Grid.

I'm using the @atlaskit/dropdown-menu in my example but it should occur with other similar components.

See here: https://codesandbox.io/s/j1w3zxxjq5

What's interesting is that it actually works fine in the Collection component.

See here: https://codesandbox.io/s/7y27qmy6y1

The difference seems to be that the Grid places a position: relative style on both the outer and inner div's whilst the Collection container only places a position: relative on the outer div. If I remove the position: relative from the inner div it all works fine.

I can't think of a good reason why both div's need the style as they're in the same position but I don't know the in's and out's of this library.

Which versions of React and react-virtualized, and which browser / OS are affected by this issue? Did this work in previous versions of react-virtualized?

Browser: Chrome react: 16.4.2 react-virtualized: 9.21.0

jkells avatar Dec 05 '18 04:12 jkells