Change the spacing of your components to define distances between your content on your website and app. In the editor, select the component whose page spacing you want to configure. Now click on the Design button in the upper bar. The following options will open on the right:
- Devices (upper blue-backgrounded line with device icons)
- Size
- Spacing
Set page spacing
You can change the spacing of your component to the component above or below it in the Spacing section. Here you can use two options to define the spacing:
Margin: Describes the area that is set outside the dashed mark around a component.
Padding: Describes the area that is defined inside the dashed mark around a component.
Learn more about margin and padding here.
Values
You can use three different values in the settings to define sizes or spacing:
- Pixel (px)
- Percent (%)
- Variables
Select the appropriate value using the small dropdown menus to the right of the empty lines. If you don't know what these values mean, you can read about it here.