Visual Spacing Controls

How To Use The Visual Spacing Controls

  1. Click to select the element you’d like to add vertical spacing to (e.g. space above or below the element.)
  2. Move your mouse to the top edge of the element’s outline to add top spacing, or the bottom edge of the element’s outline to add bottom spacing.
  3. Once your cursor changes and you see a spacing value & unit indicator (e.g. “0px”) at the edge your cursor is over, you can begin dragging to add space.
  4. Drag up or down to increase or decrease the spacing on that edge of the element.

Adding Spacing Via The Properties Panel

In the event that visually dragging the spacing is not possible or is inconvenient, you can also control vertical spacing via the Properties panel for most elements.

  1. Click the element to activate it.
  2. Navigate to the Properties panel on the left side of the interface and click the Design tab, indicated by the painter’s palette icon.
  3. Expand the Spacing section and set the Margin Top or Margin Bottom as desired.