0

I have a List component from react-virtualized where I am using the height prop to set its row height. However, the horizontal scrollbar is overlapping with the last row, making it hard to see the text content of the last row. Is there a way to increase the height of the last row so that the horizontal scrollbar doesn't overlap with the text. Doing this dynamically in code messes things up when one is dealing with a dynamic List growing in real-time. I tried using the last-child selector but had no success. Any insight would be appreciated.

helfi
  • 125
  • 3
  • 10

1 Answers1

1

The react-virtualized Grid component accounts for horizontal and vertical scrollbar size to avoid this problem. (You can see this on the Grid demo page.) However it's expected that the List component will not scroll horizontally so it will only account for the vertical scrollbar size.

If your UI needs to scroll horizontally, you may have better luck using a 1-column Grid.

bvaughn
  • 13,300
  • 45
  • 46