NG-ZORRO / ng-zorro-antd

Angular UI Component Library based on Ant Design
https://ng.ant.design
MIT License
8.86k stars 3.92k forks source link

Virtual table column alignment issue #8470

Open SaurabhHealum opened 6 months ago

SaurabhHealum commented 6 months ago

Reproduction link

https://stackblitz.com/edit/angular-fhlakd?file=src%2Fapp%2Fapp.component.ts

Steps to reproduce

  1. Use the nz-table component to create a table with virtual scrolling
  2. Set the number of rows in the table data to less than the amount required for scrollbar to appear.

What is expected?

The table columns should be aligned to the column headings, even if there is no scrollbar present.

What is actually happening?

There is excess padding at the end of the table headers to accomodate for the scrollbar. This padding is present even if there are not enough items for there to be scroll.

Environment Info
ng-zorro-antd 16.2.2
Browser any
Pills2389 commented 4 months ago

I currently have the same problem. Did you find a fix?

Pills2389 commented 4 months ago

In the end, I'm always displaying the y-scroll, no matter how many rows are in the table. This way, the header will always be aligned with the body, and I stylled the scrollbar to be more pleasent to the eye