Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
Table header bug when no data and set scroll x and y
See original GitHub issue- I have searched the issues of this repository and believe that this is not a duplicate.
Reproduction link
Steps to reproduce
- add
scroll={{ x: true, y: true }}with an emptydataSource(header should be broken) - add an element to the
dataSource(header should be fine)
What is expected?
The header should render the same way when we have data (the image below is from v3)
What is actually happening?
The header is just rendering the first column, the rest are hidden
| Environment | Info |
|---|---|
| antd | 4.12.3 |
| React | React v17 |
| System | Windows 10 |
| Browser | Chrome |
Issue Analytics
- State:
- Created 3 years ago
- Comments:5 (2 by maintainers)
Top Results From Across the Web
Table header show anomalous when no data and set scroll x ...
Reproduction link Steps to reproduce set scroll x and y Table dataSource is empty array View Table header What is expected?
Read more >css - table header is not scrolling horizontally with the body in ...
it's now fixed and doesn't move when scrolling horizontally even I specified "scrollX": true . Only the footer and body are scrolling on...
Read more >scrollX does not work — DataTables forums
The header gets scrunched up and no longer aligns with the table columns when scrollX:true is present, nor is there a horizontal scrollbar....
Read more >overflow-x - CSS: Cascading Style Sheets - MDN Web Docs
The overflow-x CSS property sets what shows when content overflows ... If overflow-y is hidden , scroll or auto and this property is...
Read more >So hard to make table header sticky - DEV Community
While we can make the vertical "sticky" scrolling look more natural by applying simple animation on the header, horizontal scroll will not be ......
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Fixed in https://github.com/react-component/table/pull/594
It is a Chrome render bug, works well in Firefox.