BugWP logo BugWP
Back to Community
Home / Community / Plugin → Gutenberg

Why Are My Paragraphs Overlapping in the Gutenberg Editor?

37 threads Sep 16, 2025 Plugin → Gutenberg

Content

If you've opened the Gutenberg editor to find your text a garbled, overlapping mess, you're not alone. This is a common issue where the visual spacing between paragraphs disappears in the editor's backend, making writing and editing nearly impossible. The good news is that the published page usually appears correctly for visitors. This guide will walk you through the most common causes and how to fix them.

Why This Happens

This visual glitch is almost never a bug in WordPress core or the Gutenberg plugin itself. Instead, it is typically caused by a conflict. The CSS rules from your active theme or another plugin are overriding the default styles that Gutenberg needs to display paragraph spacing correctly within the editor interface.

How to Troubleshoot and Fix the Issue

Follow these steps to identify and resolve the source of the problem.

1. Test for a Theme Conflict

The most frequent culprit is the active theme. To check this, temporarily switch to a default WordPress theme like Twenty Twenty-Four.

  1. Go to Appearance > Themes.
  2. If you don't already have a default theme, click Add New and install one (e.g., Twenty Twenty-Four).
  3. Activate the default theme.
  4. Open a post in the Gutenberg editor to see if the paragraph spacing has returned.

If this fixes the problem: Your original theme is the source of the conflict. The theme's stylesheet likely contains CSS that sets very low or zero margin values for paragraphs (p tags) specifically within the .editor-styles-wrapper class. You will need to contact your theme's support for assistance or add custom CSS to override this rule.

2. Test for a Plugin Conflict

If changing the theme didn't help, a plugin might be causing the issue.

  1. Go to Plugins and deactivate all your plugins.
  2. Check the Gutenberg editor again. If the spacing is correct, the problem is caused by one of your plugins.
  3. Reactivate your plugins one by one, checking the editor after each activation, until you find the one that causes the problem to return.

If you find a problematic plugin: Check the plugin's settings for any options related to editor styles. If none exist, you may need to look for an alternative plugin or contact the plugin's developers for support.

3. Use the Health Check Plugin (Advanced)

If you can't deactivate plugins on your live site, the Health Check plugin allows you to troubleshoot without affecting your visitors.

  1. Install and activate the Health Check plugin.
  2. Go to Tools > Site Health.
  3. Navigate to the Troubleshooting tab and click Enable Troubleshooting Mode. This will deactivate all plugins and switch to a default theme only for you, while your site remains normal for everyone else.
  4. From the admin bar, you can selectively re-enable your theme and plugins to test which one is causing the conflict.

Conclusion

Overlapping paragraphs in the Gutenberg editor are a frustrating but solvable display issue. The resolution almost always involves identifying a conflicting style from your theme or a plugin. By methodically testing with a default theme and deactivating plugins, you can pinpoint the cause and restore a usable editing experience.

Related Support Threads Support