> For the complete documentation index, see [llms.txt](https://docs.thunkable.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.thunkable.com/snap-to-place/intro-to-spacing.md).

# Intro to Spacing

Since mobile phones and tablets are made in all different shapes and sizes, it's not possible to simply drag and drop elements on a screen so that they are positioned on a screen like you would in a Google Slides document, which is set to a fixed height and width.

To position elements of an app in Thunkable, you'll have to manage the spacing between elements with a few powerful properties. You will also find some helpful examples in the [sample apps](/snap-to-place/sample-apps.md) section.

* [Spacing within a Screen, Row or Column](/snap-to-place/intro-to-spacing.md#spacing-within-a-screen-row-or-column)
* [Spacing around Visible Components within a Screen, Row or Column](/snap-to-place/intro-to-spacing.md#spacing-around-visible-components-within-a-screen-row-or-column)

## Spacing within a Screen, Row or Column

![](/files/-LAn66cpSYyC-nguwY8b)![](/files/-LAn66dlMf3ocUax_oHv)![](/files/-LAn66NUXZdKuEdOggze)

You can space elements within a Screen, Row or Column using two powerful properties:`Horizontal Alignment` and `Vertical Alignment`.

`Horizontal Alignment` in a Screen, Row or Column

![](/files/-LAn6CkIz6_NVW8gSZZr)

`Vertical Alignment` in a Screen, Row or Column

![](/files/-LAn6ClEA1XUmupg0fMs)

![](blob:https://legacy.gitbook.com/4099f622-4cd2-4244-bd4c-80afd170c746)![](blob:https://legacy.gitbook.com/ce335df9-b7c2-498c-87a3-b8f464d8622b)![](blob:https://legacy.gitbook.com/a7daacc3-e452-4a34-81eb-9c4b160f748c)![](blob:https://legacy.gitbook.com/742c8dc2-6d2a-4677-9eec-a7fa9334d410)![](blob:https://legacy.gitbook.com/c30087c7-706d-4cda-9aee-0678cca13230)![](blob:https://legacy.gitbook.com/2a94a8e6-5259-477c-8a76-8eff9f82378a)

## Spacing around Visible Components within a Screen, Row or Column

To create space around a visible component like an Image, you can use the `margin` and `padding` that are found in the Advanced section of the component properties. In most cases, you can add a margin OR padding to create space around an element -- they are interchangeable and can be set both in pixels and percent of the height or width. The fastest way to see what makes the most sense is to [live test](/snap-to-place/get-started/live-test.md) on your phone.

![](/files/-LAooKbnBT5BcACx0Xqf)
