---
title: "How to vertically align table contents at the top in the Knowledge base"
slug: "how-to-vertically-align-table-contents-at-the-top-in-the-knowledge-base"
description: "Learn how to change table cell vertical alignment to top for better readability in multi-line content using Custom CSS on the Knowledge Base site."
updated: 2026-06-20T09:25:02Z
published: 2026-06-20T09:25:02Z
canonical: "docs.document360.com/how-to-vertically-align-table-contents-at-the-top-in-the-knowledge-base"
---

> ## 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 vertically align table contents at the top in the Knowledge base

By default, table cell content on the Knowledge Base site is vertically centred. If you prefer content to align to the top of each cell, which is generally easier to read in tables with multi-line content, you can override this using Custom CSS. The change applies globally to all tables on the site.

---

## When to use custom vertical alignment

- **Multi-line cell content**: when cells contain bullet lists, paragraphs, or multiple lines of text, top alignment makes rows easier to scan because all content starts at the same visual baseline.
- **Mixed-length rows**: in tables where some cells are short and others are tall, top alignment prevents short content from appearing to float in the middle of a large cell.
- **Matching a design standard**: top alignment is the most common convention for data tables in documentation and product interfaces.

 NOTE

This CSS change applies to **all tables** across your Knowledge Base site. It is not possible to target individual tables using this method.

---

## Quick reference

To change vertical alignment, replace `top` with `middle` or `bottom` as required.

```
table td, table th, table tr {
    vertical-align: top !important;
}
```

| Value | Effect |
| --- | --- |
| `top` | Aligns content to the top of each cell |
| `middle` | Centres content vertically (default) |
| `bottom` | Aligns content to the bottom of each cell |

---

## How to change table vertical alignment

1. In the Knowledge Base portal, go to **Settings** > **Knowledge base site** > **Custom CSS & JavaScript**.

![Knowledge base site settings page showing the Custom CSS and JavaScript option in the left navigation.](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Custom%20css%20&%20js.png)

1. Select the **CSS** tab and paste the following snippet:

```
table td, table th, table tr {
    vertical-align: top !important;
}
```

1. Replace `top` with your desired alignment value if needed, see the reference table above.
2. Click **Save**.

![Custom CSS editor showing the vertical-align top snippet pasted in the CSS tab with the Save button visible.](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/image-1766926510813.png)

---

## Outcome

### Before

![Knowledge Base site table showing the default vertical centre alignment with content floating in the middle of tall cells.](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/1_Screenshot-Before_adding_code.png)

### After

![Knowledge Base site table showing top vertical alignment applied, with all cell content starting at the top of each row.](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/2_Screenshot-After_adding_code.png)