← All examples

Sticky table headers

Pins column headers to the top while scrolling long lists of queries and pages.

Code to copy

thead, [role="rowgroup"]:first-child,
tr:has([role="columnheader"]), tr:has(th) {
    position: sticky !important;
    top: 0 !important;
    z-index: 5 !important;
    background: #fff !important;
}
[role="columnheader"], th { box-shadow: 0 1px 0 #dadce0 !important; }

How to use this example

1. Copy the code with the button above.
2. Install JustZix (2 minutes) and open the extension on the target page.
3. Add a new rule matching that page.
4. Paste the code into the rule's CSS panel and save — the effect appears instantly.