Fixing No Elementor Column Gap

Last Updated on 9th October 2019 by James Thomas
Table of Contents

Recently when building a page in Elementor I discovered that there is a flaw in how columns work within the page builder. Like me, you’ve probably discovered that there is no Elementor column gap and no feature for enabling one within the Elementor editor.

This is problematic when it comes to designing your pages, as if you use a row with 2 or more columns, they will appear to ‘stick together’, as pictured below.

Thankfully, I managed to find quite a simple solution to insert a column gap when using rows with multiple columns in Elementor.

Here are the steps you can take to fix this issue:

  1. Click Edit on the top left of a column
  2. Navigate to the Advanced tab of the Elementor column editor (shown below)

3. Unlink the margin values for the column by clicking the icon under PX

4. Set a value of 20 for the left and right margins on the column

5. Set a value of 20 for the left and right margins on any other columns within your row

By adding a margin of 20 to the left and right side of your columns, you are basically creating a barrier. Think of it like this. Your column is sitting on the subway with two people either side – you are telling it to stick both arms out to left and right to a value of 20, now people have to stay at least 20 pixels away from it.

The end result as you can see is a nice column gap. If you’d like a larger gap, try increasing the value to 30 or 40.

Hopefully this simple solution will help you with your Elementor column gap issues. Unfortunately there isn’t a built in solution to Elementor, but I found this works well and it only takes 10 seconds to do.

Visit our new course

WP The Easy Way

Say goodbye to fancy themes, custom code, too many plugins, code conflicts and
endless WordPress headaches. Build your WordPress website the EASY way.

Say goodbye to fancy themes, custom code, too many plugins, code conflicts and endless WordPress headaches.

Build your WordPress website the
EASY way!

Build your WordPress website the EASY way

WP The Easy Way is a completely FREE video course that will teach you how to build WordPress websites without a theme, lots of plugins or a developer.

Please accept the Terms and Conditions to proceed.