How to get rid of scrolling space on the Left and Right of Elementor Pages

Does your website appear blank in the mobile view, or have huge gaps on the sides that scroll back and forth?

If you notice that your WordPress website with Elementor has big gaps on the side when you view the mobile version, this code will help you get rid of it. If you have the Hello theme installed, this will work for you. In some other themes you may have to add CSS a different way, but this is a common solution that will work for many themes.

to get rid of the white space gaps in mobile view:

From the front of your website, click Customize (at the top).
Then click Additional CSS, and paste this code into the box:


/* To hide left right overflow */
html,body
{
width: 100%;
height: 100%;
margin: 0px;
padding: 0px;
overflow-x: hidden;
}

Click PUBLISH.
That’s it! The extra space should be gone.

Recent Posts

Music Company – Artist Management Website

This scrolling, Elementor-based website features moving color blocks that rise up to match each musician’s info section and social media links.

E-commerce Website for a Holistic Therapy School

This holistic therapy school was looking for a way to unify its complex network of interconnected businesses, all under one brand. I used the incredible

A Commercial Interior Designer’s One-page Website

This one-page website portfolio was made for Naaran Barzilay, a talented designer whose work with vintage materials, reclaimed wood, and architectural remnants helped shape the

*This blog contains some affiliate links. That means that if you sign up for any of the services through my links, I get credit, and you get any discounts available.  I only recommend things I know and love, and curate my selections very carefully. (I am an artist, after all.)

Buying through an affiliate link doesn’t cost you extra, in fact it sometimes gets you discounts! If you find this blog helpful, and plan to buy one of these services anyway, please consider supporting us by using our links: