# 1 Column

<div align="left"><figure><img src="https://3401585094-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FmnBepgycwgisXr9ya1N4%2Fuploads%2FKXvu1y5a8O0D4jwHDlVV%2Fimage.png?alt=media&#x26;token=cb261e3e-bf52-4c46-80f0-9a7093d12e1b" alt="" width="66"><figcaption><p>1 Column Element</p></figcaption></figure></div>

The **`1 Column`** element provides a quick way to add a full width single column layout to your page.

This is a composite element made up of the following elements:

* 1 [Layout Container](https://docs.zingy.ai/app-editor/page-editor/built-in-elements/layout-container)&#x20;
* 1 [Layout Row](https://docs.zingy.ai/app-editor/page-editor/built-in-elements/layout-row) inside the layout container.
* 1 [Layout Column](https://docs.zingy.ai/app-editor/page-editor/built-in-elements/layout-column) inside the layout row.
* 1 example Text element&#x20;

The following element options options are preset:

* Layout Container set for full-width
* Layout Row set to center align horizontally and vertically.
* Layout Column set to use 100% width at the main setting and overridden to *Default* for the desktop screen size.
* Layout Column has a margin at the bottom using the [Custom CSS Classes](https://docs.zingy.ai/app-editor/page-element-settings#custom-css-classes) setting. For more information on adjusting the spacing see [Padding and Margin](https://docs.zingy.ai/app-editor/page-editor/padding-and-margin).

Feel free to change the preset options and delete the example Text element.

You may also add additional columns to the layout row by:

* Using the [Add Column](https://docs.zingy.ai/app-editor/page-editor/built-in-elements/add-column) Element.
* [Cloning](https://docs.zingy.ai/app-editor/working-with-page-elements#clone-the-selected-element) the existing layout column.

Additional rows can also be added by [cloning](https://docs.zingy.ai/app-editor/working-with-page-elements#clone-the-selected-element) the existing layout row.