Using Container padding presets

This is a beta feature introduced in version v1.9.0 beta1.Find out how to enable and test Beta features.

Padding presets is a spacing scale for the Elementor container widget. Similar to how Outer Section Padding and Column Gap presets worked, this new feature allows you to create padding presets and apply the dynamically on your containers. The outcome is that you can manage your container spacing with globally managed presets, resulting in consistent layouts across pages.

The Containers panel in included in Theme Style > Style Kit panel.
One thing you will notice straight out of the box, is that you now have the ability to use your own labels for each of the five presets, allowing you to use a more meaningful spacing scale.

Here is an example of the full panel expanded, and custom labelling of the presets.

Applying the presets to containers.

Applying the presets is easy. On each container, you will find a dropdown that allows you to select which preset you want to use on the container. The padding will then be applied on the container.

Overriding the padding Presets

You can override the spacing preset by manually adding a custom value to the container's padding, under the Advanced tab.

Important step after re-naming presets

After editing a name to any of the presets, when you get back to the editor you must refresh the page, in order for the updated preset names to be displayed in the dropdown.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us