# Layout Position Location Types

The location types are the names of the properties used for moving an element to a specific location: 

![](https://735683391-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LWpp_0PwLnj_AXGL2u7%2F-MDXB0A9i819qV7u42TQ%2F-MDXLYcHvy-GQl48XpUt%2Fimage.png?alt=media\&token=fca0cad0-c9fb-4587-9924-6412de2eea39)

The default position location type is **Constraint** using **left** and **top**. 

The **Constraint** or anchor option positions by using the **left**, **right**, **top**, or **bottom** properties. For centered elements a **transform** property is used. These properties do not have an effect with some [position types](https://velara-3.gitbook.io/web-export/element-options/layout-section/position-types). 

The **Padding** position option positions by using the padding-left, padding-right, padding-top, or padding-bottom properties. These properties do not have an effect with some [position types](https://velara-3.gitbook.io/web-export/element-options/layout-section/position-types). 

The **Margin** position option positions by using the margin-left, margin-right, margin-top, or margin-bottom properties. These properties do not have an effect with some [position types](https://velara-3.gitbook.io/web-export/element-options/layout-section/position-types). 

#### Using the Horizontal and Vertical options

When you use a **horizontal** option the vertical properties are not set. 

When you use a **vertical** option the horizontal properties are not set. 

For example, if you chose **Constraint (horizontal)** the CSS properties would only include **left**, **right** or **left** and **right**. This option would exclude the **top** and **bottom** properties. 

The CSS would look like this: 

```
.MyElement {
    left: 10px;
}
```

If you chose **Constraint (vertical)** the CSS properties would only include **top**, **bottom** or **top** and **bottom**. This option would exclude the **left** and **right** properties. 

The CSS would look like this: 

```
.MyElement {
    top: 10px;
}
```

You can also chose the **none** option to exclude any position location properties. 

{% hint style="warning" %}
Changing this option to anything but default or absolute can break your page from what it looks like on the artboard. Make sure you know what you are doing before using this feature and remember you can use Undo and Reset Options button if you need to revert any changes. 
{% endhint %}

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