---
title: "How to enlarge the pdf preview in the article"
slug: "how-to-enlarge-the-pdf-preview-in-the-article"
description: "With Custom CSS, you can change the PDF preview size"
tags: ["Customization"]
updated: 2026-03-10T04:32:18Z
published: 2026-03-10T04:32:18Z
---

> ## 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 enlarge the pdf preview in the article

Preview size of the PDF files in the article would vary for browsers. However, you can configure the desired width of the PDF file.

> [!NOTE]
> ** NOTE
> 
> This workaround is useful only for articles created using the WYSIWYG editor.

### Solution

To enlarge the pdf preview:

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.

![Site customization options for a knowledge base, including CSS and JavaScript settings.](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Custom%20css%20&amp;%20js.png)

The**CSS** tab is the default selection.
2. Paste the below CSS snippet in the panel.

Knowledge base Site 1.0Knowledge base Site 2.0

```css
.content_block .content_container .content_block_text p * {width: 100%;}
```

```css
article p object {
    width: 100% !important;
}
```

1. Click **Save**. ![CSS code snippet demonstrating the use of important declaration for width property.](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Enlarge%20PDF%20preview.png)

---

### Outcome

![2_Screenshot-Outcome.png](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/2_Screenshot-Outcome.png)