Hi there! In this Divi theme tutorial we’re going to teach you how to remove the white space you find at the very bottom of your Divi website. It’s a very simple bit of CSS that will help you learn how to further customise your website and make it your own.

You may have noticed on your own Divi website that under the footer credits there is a white space. Now, some people may be perfectly happy with the white space there, others, on the other hand, like me, don’t like it.

If you wish to remove the white space, simply paste the following CSS and it will remove the white space completely.

 
body {
	padding-bottom: 0 !important;
}

The current version of Divi adds 1em (a piece of CSS very similar to PX/Pixels) of padding to the bottom of the body tag, which encompasses the Divi theme footer. What we are doing with this little Divi code snippet is tell the browser to ignore that 1em setting built into the Divi theme and replace it with 0 padding, by utilising the !important tag. The !important tag makes this new code the priority, that’s why it’s !important.

Where do I put the code to remove the white space?

If you haven’t yet made a Divi child theme, then simply pop it into the Divi Theme options and hit save.

To navigate to the Divi Theme Options, simply;

  • Visit the Divi tab in the WordPress dashboard
  • Select ‘Theme Options’
  • Scroll down to the ‘Custom CSS’ box and paste the Divi code snippet

There you have it, that annoying white space at the bottom of the Divi footer is long gone. Stay tuned for more Divi snippets, tutorials, and layouts.