---
title: "How to freeze table headers"
slug: "how-to-freeze-table-headers"
updated: 2026-03-23T06:48:05Z
published: 2026-03-23T06:48:05Z
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.document360.com/llms.txt
> Use this file to discover all available pages before exploring further.

# How to freeze table headers

Freezing the table header keeps the column titles visible while scrolling through long tables. This helps readers understand the data context without repeatedly scrolling back to the top.

Document360 provides an in-built [table freeze functionality](/help/docs/tables-in-advanced-wysiwyg-editor#freeze-rows-columns). You can freeze your header row or column using this functionality.

As a workaround, you can also follow the steps below to freeze the header row for tables in your knowledge base.

1. Navigate to **Settings** (<nor class="fa-solid fa-gear" data-tomark-pass=""></nor>) > **Knowledge base site** > **Site customization** > **Custom CSS & JavaScript** in the Knowledge base portal.
2. In the CSS tab, paste the following code.

```css
.fixed-header-table div[data-type="table-content"]{
    position: relative;
    max-height: 400px;
    overflow-y: auto;
    border: 1px solid #ddd;
}
table {
    width: 100%;
    border-collapse: collapse;
}
tbody th {
    position: sticky;
    top: 0;
    z-index: 2;
}
```

1. Click **Save**.
2. Navigate to your article and open the code view.
3. Wrap up the table HTML code inside the following class.

```xml
<div class="fixed-header-table">
Your table code
</div>
```

> [!NOTE]
> NOTE
> 
> The header row remains fixed at the top of the table while the reader scrolls through the table content.

---

### Outcome

When a reader scrolls through a long table, the column headers remain visible at the top of the table, making it easier to interpret the data.

![](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Table header freezing.gif)
