You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
There is still some misalignment with 15px depending on the OS (mac vs windows) and by browser (different browsers have different scrollbar styles).
When we filter down the table to 1 entry (for example), the scrollbar disappears, but we still have the 15px margin right. As a result, the header/body is still misaligned.
Potential Solution(s):
We can add overflow-y: scroll to the body so that it always shows the scrollbar. (This will resolve the second issue). We can then try (https://davidwalsh.name/detect-scrollbar-width) to calculate the exact scrollbar width that we can use as margin. (This will resolve first issue)
Another option is to add a scrollbar to the header, but make the scrollbar background transparent to hide it.
Screenshot:
Misalignment when table body has scrollbar
The text was updated successfully, but these errors were encountered:
Issue:
When the table body has a scrollbar, the header is not aligned with the body.
We try to fix this by adding the
fixedHeight
prop to OncoKBTable which applies some margin to the right (https://github.com/oncokb/oncokb-public/blob/master/src/main/webapp/app/index.scss#L284-L291). This is a quick fix, but introduces some other issues:Potential Solution(s):
overflow-y: scroll
to the body so that it always shows the scrollbar. (This will resolve the second issue). We can then try (https://davidwalsh.name/detect-scrollbar-width) to calculate the exact scrollbar width that we can use as margin. (This will resolve first issue)Screenshot:
![image](https://private-user-images.githubusercontent.com/59149377/289932819-85462ce9-4ac3-4c70-a185-5c73d25c4f21.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTk3ODU0ODYsIm5iZiI6MTcxOTc4NTE4NiwicGF0aCI6Ii81OTE0OTM3Ny8yODk5MzI4MTktODU0NjJjZTktNGFjMy00YzcwLWExODUtNWM3M2QyNWM0ZjIxLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA2MzAlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNjMwVDIyMDYyNlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWEwMmI0MzRkZDg0NjM1Nzk3NDE4Zjc4ODIwZWY0ODBiNDA2YjZkYTFkOTYxMjJkNDhlMWM3NzQwNzkxYjY4N2MmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.Ni0GPEAVj-lC3z5pKG0CD9A9iQ7m8Q7zXUbg1Y2kvB4)
Misalignment when table body has scrollbar
The text was updated successfully, but these errors were encountered: