HIRING  We are looking to hire a web design manager. Email your CV to recruitment@digitalrefresh.uk

Removing the horizontal scrollbar when using the Divi theme
Home » CSS & Code Snippets » Removing the horizontal scrollbar when using the Divi theme

There are times when you’ve added your own custom styling to a website and begin to notice the horizontal scrollbar across the bottom of your browser window, or when on mobile devices you can to move the content left and right on the screen.

This is not something we want. It does not look great and it gives a poor user experience.

This is sometimes caused by an element which is wider than it’s container so part of it hangs off the edge of the page. You will want to investigate and find out which element is causing this and fix it.

However, sometimes you will want parts of your design hanging off the edge of the page to create a certain look or effect.

To get rid of this horizontal scroll, we add a few lines of CSS.

Adding the CSS

Place the below CSS snippet into your child themes Style Sheet or if you are not using a child theme then you can go to Divi > Theme Options > CSS

Place the following snippet.

#page-container {
overflow-x: hidden;

Everything you need to
build the best divi websites

Our premium layout packs and child themes will help save hours of designing websites from scratch. All you need to do is change the colours, images and text to suit your business.

View Themes


    Your Cart
    Your cart is emptyReturn to Shop