# Comfortable Reading Typography for Posts (SCSS)

> Tunes the line length, line height and spacing of headings, paragraphs and lists inside blog posts for long-form reading.

- Type: SCSS
- Runs: Site-wide header
- Category: [Content](https://wpide.com/library/category/content/)
- Tags: scss, typography, readability
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/readable-post-typography-scss/

## Code

```scss
$measure: 68ch;
$line-height: 1.7;
$flow: 1.25em;

.single-post {
    .entry-content,
    .wp-block-post-content {
        line-height: $line-height;

        > p,
        > ul,
        > ol,
        > blockquote {
            max-width: $measure;
        }

        > * + * {
            margin-top: $flow;
        }

        h2,
        h3,
        h4 {
            margin-top: $flow * 2;
            margin-bottom: $flow * 0.5;
            line-height: 1.25;
        }

        li + li {
            margin-top: 0.4em;
        }
    }
}
```

## Notes

The measure limits the width of text blocks; wide and full-width blocks are not affected.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Comfortable Reading Typography for Posts (SCSS)" in its snippet library and add it in one click; or create a new SCSS snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/