# Spacer

<div align="left"><figure><img src="https://3401585094-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FmnBepgycwgisXr9ya1N4%2Fuploads%2FG2FPTMECh0kcEbmppazu%2Fimage.png?alt=media&#x26;token=43918912-d811-40dd-89f9-3de6dfc1ffb5" alt="" width="68"><figcaption><p>Spacer Element</p></figcaption></figure></div>

Available under the 'Layout' category, the **`Spacer`** element allows you to add empty vertical space to your page.

***

## Spacer Width

The Spacer element always uses the full horizontal area of the parent element it is placed in.&#x20;

Example below shows Spacer0 occupying the full width of the page as it is placed inside the main page body.

<div align="left"><figure><img src="https://3401585094-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FmnBepgycwgisXr9ya1N4%2Fuploads%2FayG4rCienBJ9qNSX4dyY%2Fimage.png?alt=media&#x26;token=da3602a3-4d1e-4187-bb80-065329b42a69" alt=""><figcaption><p>Example Spacer using full page width</p></figcaption></figure></div>

Example below shows Spacer1 occupying the width of the layout column it is placed in.

<figure><img src="https://3401585094-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FmnBepgycwgisXr9ya1N4%2Fuploads%2F9eBp5JYCZLL3RkyWo72B%2Fimage.png?alt=media&#x26;token=7db429e1-45e3-439f-94da-2f5366ab4c7c" alt=""><figcaption><p>Example Spacer using width of a layout column</p></figcaption></figure>

***

## Vertical Sizing

<div align="left"><figure><img src="https://3401585094-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FmnBepgycwgisXr9ya1N4%2Fuploads%2FCfBu6yLsb2Ht5gxmV7RP%2Fimage.png?alt=media&#x26;token=ea7a3f8b-4324-47ea-895d-d3358c574d0f" alt="" width="471"><figcaption><p>Resizing Spacer</p></figcaption></figure></div>

You can resize by using the rectangular notches that appear when you select the element.
