Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Something wrong with fixed columns and header #6515

Closed
benjycui opened this issue Jun 19, 2017 · 13 comments
Closed

Something wrong with fixed columns and header #6515

benjycui opened this issue Jun 19, 2017 · 13 comments
Assignees
Labels

Comments

@benjycui
Copy link
Contributor

@benjycui benjycui commented Jun 19, 2017

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

image

image

OS: Mac OS

Browser:

image

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
Copy link
Contributor Author

@benjycui benjycui commented Jun 19, 2017

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

@yesmeck yesmeck self-assigned this Oct 24, 2017
@yesmeck
Copy link
Member

@yesmeck yesmeck commented Nov 13, 2017

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

@benjycui
Copy link
Contributor Author

@benjycui benjycui commented Nov 14, 2017

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

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

@ApacheEx
Copy link
Contributor

@ApacheEx ApacheEx commented Feb 19, 2018

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:
image

@jagratiTomar
Copy link

@jagratiTomar jagratiTomar commented May 16, 2018

Any update on this issue?

@zhengqingxin
Copy link

@zhengqingxin zhengqingxin commented Jul 27, 2018

有解决方案了吗?

@AngusFu
Copy link

@AngusFu AngusFu commented Sep 7, 2018

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
Copy link
Member

@zombieJ zombieJ commented Sep 8, 2018

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
Copy link
Member

@afc163 afc163 commented Sep 8, 2018

@zombieJ Weird and nice workaround!

opacity: 0.9999;
@zombieJ zombieJ closed this in b1f9f03 Sep 8, 2018
@AngusFu
Copy link

@AngusFu AngusFu commented Sep 10, 2018

@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:

image

@afc163
Copy link
Member

@afc163 afc163 commented Sep 10, 2018

@andriijas You can test it and send us PR.

@sjdeak
Copy link

@sjdeak sjdeak commented Dec 5, 2018

@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?

image

@afc163 afc163 added FAQ and removed Inactive labels Dec 5, 2018
@ethanysc
Copy link

@ethanysc ethanysc commented Mar 7, 2019

.ant-table-fixed-header .ant-table-scroll .ant-table-header {
    overflow: hidden !important;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet