# Skip Rendering Off-Screen Comments and Footers Until Needed

> Uses the CSS content-visibility property so browsers skip laying out the comments section, footer and related posts until the visitor scrolls near them, which speeds up rendering of long pages.

- Type: CSS
- Runs: Site-wide header
- Category: [Performance](https://wpide.com/library/category/performance/)
- Tags: css, rendering, core-web-vitals
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/perf-content-visibility-below-fold/

## Code

```css
#comments,
.comments-area,
.wp-block-comments,
.site-footer,
footer.wp-block-template-part,
.related-posts,
.jp-relatedposts {
    content-visibility: auto;
    contain-intrinsic-size: auto 800px;
}
```

## Notes

Adjust the selectors to your theme; the size hint keeps the scrollbar from jumping.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Skip Rendering Off-Screen Comments and Footers Until Needed" in its snippet library and add it in one click; or create a new CSS snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/
