Devextreme-reactive: Virtual table width problem (i.e. rest of column got invisible after certain width)

[rao123dk]

• [ x ] I have searched this repository's issues and believe that this is not a duplicate.

I'm using ...

• [X ] React Grid
• [ ] React Chart
• [ ] React Scheduler

Current Behaviour

I have implemented a complete table component with own custom template.
As you said in this link, I followed the same link and my table header fixing problem is fixed, but when I am scrolling my table Horizontally then after certain width rest table cell/row got hide. What's the problem. Please guide.

Expected Behaviour

All data. should display.

Steps to Reproduce (for Bugs)

Environment

• devextreme-reactive: -1.8.0
• react: 16.4.2
• browser: chrome 70+
• bootstrap: none
• react-bootstrap: none
• material-ui: none

[ushkal]

Hi,
 
Would you please provide us with a sample project where the issue can be seen?

[rao123dk]

Please refer this.

Have a look:-

1. First, resize column you will see some hidden column will display according to the width.
2. scroll horizontally , can not see columns ...

[ushkal]

The cause of the problem is that a style passed to the TableContainer component overwrites your 'overflow' style property so this element does not trigger scroll events. To fix this, just merge styles from props with yours. Here's the updated project. Please let me know if it helps.

[ushkal]

This behavior is expected: the column width is set to 200px and a stub header cell fills the remaining space. To make it appear as a single cell I recommend that you apply the same background style to your stub header cell component and show a resizing control on hover only.

[lock[bot]]

This thread has been automatically locked since it is closed and there has not been any recent activity. Please open a new issue for related bugs or feature requests.