Colors, fonts and layout

Change the space around and inside items

Tighten or loosen the gaps around a photo, button or section, outside its edges or inside them, with numbers or by dragging.

Every item on a page has breathing room. Outer spacing is the gap outside its edges (the margin). Inner spacing is the gap inside its edges (the padding). Adjusting them changes how tight or airy a section feels.

Steps

  1. Log in to your site editor and open the page.
  2. Click the item, then click Edit Design in the small menu.
  3. Open the Spacing section.
  4. The outer box controls the space outside the item. Type new numbers into it, or click a number and drag the slider.
  5. For the space inside the item, do the same in the inner box.
  6. By default, the left and right numbers move together. To set them apart, click the link icon.
  7. Look at the page. Adjust until it feels right.
  8. Publish. If you don't see a Publish button, tell us and we'll publish it for you.

Drag instead

For an item inside a column, you can also drag its edges on the page. Left and right edges adjust the side gaps in a row of items. Top and bottom edges adjust the gaps in a stack. Dragging unlinks the two sides, so each one moves alone.

Reset the space

To put an item's spacing back to zero, use the Reset padding icon in the small menu, or in the design panel.

Odd gaps you can't remove

If a gap won't budge, check every part of the item, including the column it sits in. If it still won't go, send us the page and tell us which gap, and we'll take care of it.

Tips

Need a hand?

Email hello@zossoz.com with your business name, the page and which gap looks wrong, and we'll take care of it. We reply within one business day. See Request a change.

Last reviewed