translateContentSizeYToHolder with display: table-cell cause problem

[gaetansnl]

What is the current behavior? Scrollbar break the placement. It works if I remove display: table-cell

What is the expected behavior? To get the same result as without Scrollbar

 <Scrollbar translateContentSizeYToHolder>
  <div style={{display: 'flex', alignItems:'center'}}>
                    <div style={{ margin: '0 auto' }} />
                                <div style={{display: 'flex', flex: '0 0 240px'}}>
                                    test
                                </div>
                    <div style={{ margin: '0 auto' }} />
                </div>
</Scrollbar>

A little about versions:

• OS: Windows
• Browser (vendor and version): All
• React: Latest
• react-scrollbars-custom: v4.0.18

[xobotyi]

@gaetansnl Please provide sandbox;

[gaetansnl]

@xobotyi Here it is https://codesandbox.io/s/angry-ramanujan-ht39t

[bdobry]

Same issue here on v4.0.18. For me content's width set to 100% is not working correctly

[ranihorev]

Adding this code to the scrollbar component fixed it for me: contentProps={{ style: { display: 'block' }, }}

[kiliancs]

FWIW This issue is still persent on 4.0.21.