Padding/Margin field

Margin and Padding fields are very similar to each other. The only difference is that margin field accept negative integers.

When use Margin or Padding field?

Margin field should be used to create a gap between shortcodes or elements inside shortcode like Icons, Buttons etc. Padding field should be used to create a gap between background edges and content. For better undestanding, please check the image below.

Source: www.w3schools.com

How to use Margin/Padding field?

By default, Margin and Padding field have 2 options to fill up. The first one is an numeric field representing the gap width and second one is an unit.

  • All – an integer only field to specify the gap width
  • Unit – a list of available width units: px, em and %

fields-margin

What are Advanced Settings for?

Advanced Settings(1) provides more control over Margin/Padding gap. With this option enabled you are able to specify a width for each edge separately(2). Empty fields will not be included in output.

margin-advanced

Video Tutorial

Please check the video tutorial showed below for better reference.