Skip to main content

How to add spacing

Create responsive content with padding and margins

Jørgen Wigum Lurvik avatar
Written by Jørgen Wigum Lurvik
Updated this week

There are two main ways to control space around elements: margin and padding.

  • Margin: Adds space outside the element.

  • Padding: Adds space inside the element, between the content and its border.

How to Add Spacing

  1. Select the element (like a text box or heading).

  2. In the Style Panel on the right, click the + next to margin or padding.

  3. Choose where to apply the spacing (top, bottom, left, right).

  4. Set a value (e.g., 20px, 10%, or 5vh).

  5. Adjust until it looks how you want.

You can even use negative values like -100px if needed.

Evenly Space Multiple Items

If you have several items (like buttons or images) and want even spacing:

  1. Select all the elements.

  2. In the Style Panel, find the Distribute tool.

  3. Choose Distribute Horizontally or Vertically.

Section spacing

To keep consistent space between full sections:

  1. Click on the section.

  2. Go to Section Spacing in the Style Panel.

  3. Add top/bottom padding (e.g., 100px top, 100px bottom).

This is especially helpful when working with writers, as the content can change without messing up the layout.

Did this answer your question?