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 over a month ago

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?