Overflow: Scrolling causes hidden columns of the table to not be rendered. What went wrong?

Question

I'm integrating react-grid into an existing flask application. In order to do this I have to compile the application using a custom webpack configuration. I am able to successfully render the react component, but when I use react-grid and apply overflow:scroll, only the visible part of the table is rendered and the rest of the scroll area remains blank. Click here to see the gif of ReactGrid with overflow scrolling enabled. Click here to see ReactG without overflow scrolling enabled.

P粉759451255 · Answer

I solved this problem. I set overflow:scroll in the browser by inspecting the element. Reactgrid seems to use a predefined width for calculation when the component is first rendered. Setting overflow: scroll in my CSS file and reloading the page solved the problem.