Something wrong with fixed columns and header

[benjycui]

Ref: https://ant.design/components/table/#components-table-demo-fixed-columns-header

OS: Mac OS

Browser:

Only can re-produce in Dell screen which is connected to Mac. If we view the same demo in the same machine but with Mac's own screen, it works fine.

[benjycui]

I try to resize browser, it seems that it doesn't relate to browser's width.

[yesmeck]

@benjycui 是说滚动条的位置不对？

[benjycui]

上下出现了两个滚动条，并且这个是要在特定显示屏才能看的到。

上班后再当面看吧，也是个诡异的问题。

[ApacheEx]

The same issue here. I can reproduce it with this example:
https://codesandbox.io/s/38rjlrl006

A table with rowSelection + fixed header / columns.

If I remove rowSelection, then everything looks good.

My browser version:

[jagratiTomar]

Any update on this issue?

[zhengqingxin]

有解决方案了吗？

[AngusFu]

Seems this issue is still not resolved, since more than one year ago.
May be i should just try something like react-virtualized? The migration work is not easy however.

[zombieJ]

Set header div opacity can hide the scroll bar as workaround, but not sure if it's the best way: https://codepen.io/zombieJ/pen/MqOZdX

@afc163 , how do you think about this?

[afc163]

@zombieJ Weird and nice workaround!

opacity: 0.9999;

[AngusFu]

@afc163 @zombieJ Hmm, V3.9.2 does have fixed the extra scrollbar in table header.

But seems the left fixed column(s) (.ant-table-fixed-left > .ant-table-body-outer) was still not fixed, which as described and outline by the screenshot in #12139.

May be you should just checkout the demo given in #12139 again, and opacity: 0.999 would help too.

Demo: https://codepen.io/AngusFu/pen/yxPgXY

Screenshot with v3.9.2:

[afc163]

@andriijas You can test it and send us PR.

[sjdeak]

@afc163 coming from #13421, this problem still exists in the 3.11.0 official demo, even if i try the workaround(opacity: 0.9999), anyone can give a hand?

[ethanysc]

.ant-table-fixed-header .ant-table-scroll .ant-table-header {
    overflow: hidden !important;
}