Understanding Spacing: Margin vs Padding in Divi

Spacing controls how close or far apart elements are on your page. Divi uses margin and padding to adjust this.

Step 1 – Enable the Visual Builder

Go to the page you want to adjust and click Enable Visual Builder in the WordPress admin bar.

Step 2 – Open Module, Row, or Section Settings

Hover over the content you want to adjust and click the gear icon.
In the Design tab, scroll to the Spacing section.

Step 3 – Adjust Padding (Inside Space)

Padding adds space inside an element, between the content and its border.
Example: use padding to give text some breathing room inside a colored box.

Step 4 – Adjust Margin (Outside Space)

Margin adds space outside an element, between that element and the ones around it.
Example: use margin to create more space between two sections.

Step 5 – Use Linked or Individual Controls

You can:

• Adjust all sides at once (linked).

• Set different values for top, right, bottom, and left (unlinked).

Step 6 – Save and Preview

Click the green checkmark to confirm, then Save (bottom-right purple circle).
Exit the builder and check how your spacing looks on the live page.

Additional Notes

• Use padding for internal breathing room.

• Use margin to separate elements from each other.

• Check spacing on mobile and tablet — sometimes extra adjustments are needed.