> For the complete documentation index, see [llms.txt](https://docs.feathery.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.feathery.io/platform/build-forms/design/alignment-and-spacing.md).

# Alignment and Spacing

Elements and containers can be quickly aligned and spaced out using the **Styles** tab in the right panel.

### Alignment

#### How to align containers

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.  

<figure><img src="/files/QqSjJwjfqX4i7QykwZDW" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
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.
{% endhint %}

#### How to align elements

If you want all the objects to have the same alignment...

* Select the parent container
* Modify `Align content` to apply one alignment to all elements inside the container.

If you want to give a different alignment to some objects...

* Select the element directly
* Modify `Align self` to override the container styles for the individual element

<figure><img src="/files/YgtH6LreUB0JhdX0kmht" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
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 self` modified, it may not react to `align content`.
{% endhint %}

### Spacing

#### How to use gaps

You can evenly space out all objects inside a container using `Gaps`. A standard `Gap` can be added in the **Layout** section of the **Style** tab.&#x20;

Gaps allow you to evenly space out objects you have already placed and any new objects added to the container.&#x20;

<figure><img src="/files/pXloDHAGClBzPsrTyrT7" alt=""><figcaption></figcaption></figure>

#### How to use automated spacing

Use `Spacing` to set an automatic layout if you have multiple objects inside a container with its height set to `fill` or an exact `pixel` value.&#x20;

If your objects are in a `fit` container, 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.

<figure><img src="/files/OiRA2b7JXlu916KatDoM" alt=""><figcaption></figcaption></figure>

### Demo

{% embed url="<https://www.loom.com/share/a6fb7df0dd774535985f7f4b1c6f26e4>" %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.feathery.io/platform/build-forms/design/alignment-and-spacing.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.