---
description: Change the default size, position and layout of an element
---

# Layout Section

The layout section contains 3 layout options that are also a shortcut to common layouts and sizing:

* The [positioning](https://developer.mozilla.org/en-US/docs/Web/CSS/position)
* The layout location options
* [Sizing options](layout-section/sizing-options)

![](https://735683391-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LWpp_0PwLnj_AXGL2u7%2F-MDXB0A9i819qV7u42TQ%2F-MDXHEWCwPX28S5awxS5%2Fimage.png?alt=media\&token=4b4c434a-b528-497e-a814-38fde3081386)

You can define what layout options to use or use none at all.&#x20;

The [layout position types](layout-section/position-types) are the same the ones listed in the CSS [position](https://developer.mozilla.org/en-US/docs/Web/CSS/position) property:&#x20;

![](https://735683391-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LWpp_0PwLnj_AXGL2u7%2F-MDXB0A9i819qV7u42TQ%2F-MDXGVLI-VA5tXELLvmp%2Fimage.png?alt=media\&token=47d8e998-b92b-4c12-9eeb-0f9bb2162661)

The [layout location types](layout-section/position-location) are the properties used for moving an element to a specific location:&#x20;

![](https://735683391-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LWpp_0PwLnj_AXGL2u7%2F-MDXB0A9i819qV7u42TQ%2F-MDXGhD8ZCldyq4fqzTR%2Fimage.png?alt=media\&token=f74f5c66-e72d-4b21-b810-d77b08ac2fb9)

The [size type options](layout-section/sizing-options) are the properties used for setting the size:&#x20;

![](https://735683391-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LWpp_0PwLnj_AXGL2u7%2F-MDXB0A9i819qV7u42TQ%2F-MDXGoDkbrkQfaDRc-za%2Fimage.png?alt=media\&token=22412150-d567-4295-9d09-d5d3e309469e)

The default option for layout is **absolute**, using constraints such as top and left and setting both width and height.&#x20;

{% hint style="info" %}
There is another layout option for groups for [Row Layout](row-layout) and [Column Layout](column-layout)
{% endhint %}



{% embed url="https://developer.mozilla.org/en-US/docs/Web/CSS/position" %}

