Skip to main content
Get Started
Documentation/Elements & Controls Reference/Layout and Shared Controls/Shared Controls/Spacing and Sizing

Spacing and Sizing

Use Design > Size and Spacing where available. Controls vary by element.

Element Size

Set Width and height constraints. Min Width / Min Height set lower bounds; Max Width / Max Height cap growth. Fixed heights can overflow with longer content.

Pixels are fixed; percentages follow the containing block; vw/vh follow the viewport; em/rem follow font sizes. Available units depend on the control.

Element Size controls with width value and unit selector visible
Element Size controls with width value and unit selector visible

Section Size

Sections have an outer background and inner content container:

  • Height — Fit Content, Viewport, or Custom.
  • Custom Height — Custom-mode height.
  • Min Height — Minimum while permitting growth.
  • Width — Contained, Full, or Custom content width.
  • Container Width — Custom content width.
Section Size controls beside a full-width background with a constrained content container
Section Size controls beside a full-width background with a constrained content container

Spacing

Padding adds inner space; margins add outer space. Set all sides together or separate top/right/bottom/left values; some elements offer only Margin Top / Margin Bottom. Negative margins pull elements together; padding cannot be negative.

Spacing controls showing separate padding sides and top and bottom margins
Spacing controls showing separate padding sides and top and bottom margins

Parent Gap separates children without outer space; child margins add to it. Basic Grid overrides child dimensions unless Advanced > Use Original Item Dimensions is enabled. Use supported responsive values for smaller widths.

← PreviousWrapper StylesNext →Backgrounds and Gradients
On this page
Element SizeSpacing
Video tutorials ↗ Facebook group ↗ Support ↗