Alignment and Spacing
Quickly align and space out elements in your form.
Elements and containers can be quickly aligned and spaced out using the Styles tab in the right panel.
You can align containers and all objects inside by modifying the Layout in the Style tab.
You'll see two kinds of alignment when you select a container;
Align self: Use this to modify the position of the selected container.
Align content: Use this to modify all the objects inside the selected container without impacting the parent container.
Create a form body container nested inside your step container to easily align the form content and set a standard width. This is especially helpful for stand-alone forms that are not embedded.
If you want all the objects to have the same alignment...
- Select the parent container
Align contentto apply one alignment to all elements inside the container.
If you want to give a different alignment to some objects...
- Select the element directly
Align selfto override the container styles for the individual element
Not seeing the alignment you applied? Check the individual object and its parent container to see if an override alignment is applied. If an object has
align selfmodified, it may not react to
You can evenly space out all objects inside a container using
Gaps. A standard
Gapcan be added in the Layout section of the Style tab.
Gaps allow you to evenly space out objects you have already placed and any new objects added to the container.
Spacingto set an automatic layout if you have multiple objects inside a container with its height set to
fillor an exact
If your objects are in a
fitcontainer, use Gaps instead. Automatic spacing also will not impact containers with a single element or container in it. Add another object to see the spacing applied.