How to Fix a White Spacer on Your WordPress Website

If you have ever noticed an unwanted white gap or horizontal scroll bar on your WordPress site — especially on mobile — you are not alone. Elementor and other page builders can sometimes leave extra space that is hard to remove from the editor alone.

This method works on any WordPress website, regardless of which builder you use. It takes about a minute.

Step 1: Open the WordPress Customizer

Log in to your WordPress dashboard, then go to Appearance → Customize (or click Customize your site from the admin bar).

If you build with Elementor and have already tried every layout option without success, this CSS-based fix is the reliable route.

Step 2: Add the CSS

Open Additional CSS in the Customizer. Paste the code below — think of it as a small config setter that closes the extra horizontal space on smaller screens.

@media only screen and (max-width: 768px) {
  html,
  body {
    width: 100%;
    overflow-x: hidden;
  }
}

Click Publish to save your changes.

Step 3: Reload and verify

Refresh your site on mobile (or resize your browser below 768px wide). The white spacer and sideways scroll should be gone.

This rule sets overflow-x: hidden on the root elements for viewports up to 768px, which prevents content from spilling past the screen edge — the usual cause of that white strip.

Watch the video

Prefer a walkthrough? Watch the full tutorial on YouTube or subscribe to the Sam Syntax channel.