GitHub user dosubot[bot] added a comment to the discussion: How to remove the
hairline gaps between thead cells in pivot table , the bg content becomes
visible while scrolling
<!-- Answer -->
This happens because the sticky header (`thead`) stays fixed at the top, but
the table's border is part of the scrolling body, not the sticky header. In
Superset's pivot table, the CSS uses `border-collapse: separate` and sets
borders on individual header cells, which can cause visible gaps and border
misalignment when scrolling with sticky headers. There are no built-in
workarounds for this in the codebase—it's a side effect of how CSS handles
sticky positioning and borders in tables[^1^].
To fix this, try these changes in your pivot table's `Styles.js`:
- Change `border-collapse: separate` to `border-collapse: collapse` on
`.pvtTable`.
- Set a uniform border on all sides of `th` in thead, for example: `border: 1px
solid ${theme.colorSplit};`.
- Remove or adjust any custom border rules that only apply to certain sides or
cells, so the sticky header always has a complete border.
This should keep the header borders visually aligned with the sticky header
during scroll.
[^1^]: [Superset Styles.js - sticky header and border
rules](https://github.com/apache/superset/blob/829e4d92d91ceae4b43b1ed3b063ffe45377799c/superset-frontend/plugins/plugin-chart-pivot-table/src/react-pivottable/Styles.js)
<!-- Dosu Comment Footer -->
*To reply, just mention [@dosu](https://go.dosu.dev/dosubot).*
---
<sup>How did I do?
[Good](https://app.dosu.dev/response-feedback/f542a4de-0f1b-4235-9306-92b875fb7af1?feedback_type=great_response)
|
[Irrelevant](https://app.dosu.dev/response-feedback/f542a4de-0f1b-4235-9306-92b875fb7af1?feedback_type=irrelevant_answer)
|
[Incorrect](https://app.dosu.dev/response-feedback/f542a4de-0f1b-4235-9306-92b875fb7af1?feedback_type=incorrect_sources)
|
[Verbose](https://app.dosu.dev/response-feedback/f542a4de-0f1b-4235-9306-92b875fb7af1?feedback_type=too_verbose)
|
[Hallucination](https://app.dosu.dev/response-feedback/f542a4de-0f1b-4235-9306-92b875fb7af1?feedback_type=hallucination)
| [Report
🐛](https://app.dosu.dev/response-feedback/f542a4de-0f1b-4235-9306-92b875fb7af1?feedback_type=bug_report)
|
[Other](https://app.dosu.dev/response-feedback/f542a4de-0f1b-4235-9306-92b875fb7af1?feedback_type=other)</sup> [](https://app.dosu.dev/a28d3c7e-a9d3-459e-9fb6-3a6f9ff4f357/ask?utm_source=github)&
nbsp;[](https://go.dosu.dev/discord-bot) [](https://twitter.com/intent/tweet?text=%40dosu_ai%20helped%20me%20solve%20this%20issue!&url=https%3A//github.com/apache/superset/discussions/34834)
GitHub link:
https://github.com/apache/superset/discussions/34834#discussioncomment-14201212
----
This is an automatically sent email for [email protected].
To unsubscribe, please send an email to:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
