Global Spacing

Customizing Global Spacing in Breakdance

In Breakdance, you can make adjustments to global spacing values to prevent duplication of work and streamline your design process.

Locating Global Spacing Settings

You can find the global spacing settings by clicking the ‘…’ menu at the top right of the Breakdance builder interface, then navigating to Global Settings > Containers.

Available Global Spacing Settings

Sections

In the Global Settings > Containers section, click the edit icon next to ‘Sections’ to access the spacing settings for Section elements.

• Container Width: This is the maximum width of each Section’s inner container. It’s recommended to leave this at the default value unless you have a specific reason to change it.
• Vertical Padding: Vertical padding adds white-space between Sections and makes your site more readable. The default is carefully chosen, but you can change it if you wish.
• Horizontal Padding: Horizontal padding adds space between the left and right edges of the screen and your Section’s contents.

Column Gap

The Column Gap control allows you to change the amount of space between each column within a Columns element. Setting a reasonable default globally ensures your design spacing will remain more consistent.

Overriding Global Spacing Settings

Most global spacing settings can be overridden on a per-element basis via the Properties Panel on the left side of the Breakdance interface. We don’t recommend doing this, as setting these types of properties on a per-element basis can lead to a less cohesive design.