Elementor: Remove spaces between elements

Elementor has a great page builder with all the elements nicely designed out of the box. However, there is one feature which is frustrated me now I want even more detailed control of my designs.

This is the gap between elements. It is set to 20px by default which is a good value and gives a good look for most designs.

However, you may want to have items up against each other. IN which case you can change this value in the global settings.  Click on the top left in the toolbar and choose site settings. You will see a section marketed as the layout and in there a slider to whitespace.

The whitespace option will show on your current page in real time so you can check what it looks like. Notice it affects ALL elements and this may then have some unforeseen consequences.

If this does more “harm” than good to your layout are their other options?

Yes, the other option is to edit one of the elements you want to be closer together. To remove the 20px of whitespace, you can set a margin of -20px on one element instead.  You will have to enter the value 20 and then put in the munis sign, but it works and this variation will not affect the other elements on the site globally.