# \[SOLVED\] Intro to Sizing | Snap to Place | Thunkable Docs

**URL:** https://community.thunkable.com/t/solved-intro-to-sizing-snap-to-place-thunkable-docs/3082155
**Category:** Questions about Thunkable X
**Tags:** beginner
**Created:** [July 1, 2024, 11:15pm UTC](https://community.thunkable.com/t/solved-intro-to-sizing-snap-to-place-thunkable-docs/3082155 "2024-07-01T23:15:45Z")
**Posts on this page:** 9
**Page:** 1

<div class="post-metadata">

### Author: ![peterjamesleniq](https://avatars.discourse-cdn.com/v4/letter/p/9fc348/32.png) [@peterjamesleniq](https://community.thunkable.com/u/peterjamesleniq)
#### Post date: [July 1, 2024, 11:15pm UTC](https://community.thunkable.com/t/solved-intro-to-sizing-snap-to-place-thunkable-docs/3082155/1 "2024-07-01T23:15:45Z")

</div>

> **[🖼️ Intro to Sizing | Thunkable Docs](https://docs.thunkable.com/v/snap-to-place/intro-to-sizing)**

Just wondering if the following are still available.  
I can’t find Relative size, Absolute size, Fit contents, or Fill container anywhere.

Or maybe I’m missing something I’m expected to know.

 ![Untitled](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/c/f/cfd0cc95c50e064a0376ecceb5fd671e142cd02f.png)

Don’t know why I didn’t answer this before, but the link is:  
[https://x.thunkable.com/projects/64e80833f2ac031b5b92fee3/806af29f-65a1-4ba0-aa52-011f16cde581/designer](https://x.thunkable.com/projects/64e80833f2ac031b5b92fee3/806af29f-65a1-4ba0-aa52-011f16cde581/designer)

 ![Untitled](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/c/7/c759ecbddfa9c46935ed26f50424b1f24a9b5fc3.png)  
@matt_conroy

---

<div class="post-metadata">

### Author: ![matt\_conroy](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/matt_conroy/32/150843_2.png) [@matt\_conroy](https://community.thunkable.com/u/matt_conroy)
#### Post date: [July 2, 2024, 1:08pm UTC](https://community.thunkable.com/t/solved-intro-to-sizing-snap-to-place-thunkable-docs/3082155/2 "2024-07-02T13:08:54Z")

</div>

@peterjamesleniq Those are the docs for our Snap to Place editor, the project in the screenshot is made using our Drag and Drop editor.

You can use the Layout component with the Drag and Drop editor, this will allow you to position UI components on the screen relative to other components. It also allows for relative or absolute sizing.

> **[What is Thunkable? | Thunkable Docs](https://docs.thunkable.com/#one-product-two-interfaces)**

> **[Layout Component | Thunkable Docs](https://docs.thunkable.com/app-design/ui-components/basic-components/layout)**

---

<div class="post-metadata">

### Author: ![peterjamesleniq](https://avatars.discourse-cdn.com/v4/letter/p/9fc348/32.png) [@peterjamesleniq](https://community.thunkable.com/u/peterjamesleniq)
#### Post date: [July 3, 2024, 7:31am UTC](https://community.thunkable.com/t/solved-intro-to-sizing-snap-to-place-thunkable-docs/3082155/3 "2024-07-03T07:31:02Z")

</div>

Hi Matt.

Thanks for the answer, this almost exactly want I need.

The icon looks like it has 3 boxes in it.  
 ![Untitled](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/c/4/c4aaaed3dc301ebf2fdbbf5d115fc3ea549bf8b7.png)  
I’m wondering if we are actually able to make such a design.  
Meaning one long vertical box on the left and 2 boxes on the right.  
The design I want to do will be different, but if I can make a Layout like the 3 boxes in the icon, I should be able to create a Layout which I’m looking for.

---

<div class="post-metadata">

### Author: ![matt\_conroy](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/matt_conroy/32/150843_2.png) [@matt\_conroy](https://community.thunkable.com/u/matt_conroy)
#### Post date: [July 3, 2024, 6:53pm UTC](https://community.thunkable.com/t/solved-intro-to-sizing-snap-to-place-thunkable-docs/3082155/4 "2024-07-03T18:53:48Z")

</div>

The icon used for the Layout component is just a reference, you can always manipulate the size and orientation of the Layout and its containers (vertical or horizontal)–this is where it would be similar to rows and columns you saw in Snap to Place projects.

You could absolutely replicate the layout of the image in your original post. From a quick glance, it would be comprised of a vertical Layout component with 3 or 4 main containers. Let me know I can offer further guidance!

---

<div class="post-metadata">

### Author: ![peterjamesleniq](https://avatars.discourse-cdn.com/v4/letter/p/9fc348/32.png) [@peterjamesleniq](https://community.thunkable.com/u/peterjamesleniq)
#### Post date: [July 4, 2024, 2:52am UTC](https://community.thunkable.com/t/solved-intro-to-sizing-snap-to-place-thunkable-docs/3082155/5 "2024-07-04T02:52:33Z")

</div>

Hi Matt.  
In order to make something like the component in the icon I did the following.  
I put a vertical container to a Layout component.  
(colours added so we can see what is happening.)

 ![Untitled](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/0/c/0c232022759e10873607dd40e6fcc598909495d0.png)

But when I try and add another vertical container next to it, I can’t, it always goes below, never to the side.

 ![Untitled](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/9/8/98dfbe2ddb153a10a405fc7e218f4d6186b365c3.png)

If I use 2 different Layout components, I can of course do it, but I was wondering if it can be done by using only one Layout component.

Link to example project.  
[https://x.thunkable.com/projects/6552e9bb1fc11c410e3ab415/fff88835-becb-4a67-8e64-096c9a679fb5/designer](https://x.thunkable.com/projects/6552e9bb1fc11c410e3ab415/fff88835-becb-4a67-8e64-096c9a679fb5/designer)

---

<div class="post-metadata">

### Author: ![ioannis](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/ioannis/32/146956_2.png) [@ioannis](https://community.thunkable.com/u/ioannis)
#### Post date: [July 5, 2024, 7:44pm UTC](https://community.thunkable.com/t/solved-intro-to-sizing-snap-to-place-thunkable-docs/3082155/6 "2024-07-05T19:44:47Z")

</div>

Hello @peterjamesleniq  
To build this you will need to change the Layout to horizontal

 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/a/8/a8feaa0e0fce1638734b2c19bf1e66f1098e7abd.png)  
Then inside the second container add two containers  
Here is the project: [Thunkable](https://x.thunkable.com/projects/66884bb56cc956c69570cdc1/)

---

<div class="post-metadata">

### Author: ![peterjamesleniq](https://avatars.discourse-cdn.com/v4/letter/p/9fc348/32.png) [@peterjamesleniq](https://community.thunkable.com/u/peterjamesleniq)
#### Post date: [July 5, 2024, 11:45pm UTC](https://community.thunkable.com/t/solved-intro-to-sizing-snap-to-place-thunkable-docs/3082155/7 "2024-07-05T23:45:00Z")

</div>

Hi Ioannis.  
Damn, I now see see what I was doing wrong.  
I wasn’t puting the direction of the Layout in correctly.  
Thanks for that.  
That’s a life saver.

 ![Untitled](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/a/c/ac996bf42a1700ea1c8bb9b4c48a8e4767cad983.png)

---

<div class="post-metadata">

### Author: ![peterjamesleniq](https://avatars.discourse-cdn.com/v4/letter/p/9fc348/32.png) [@peterjamesleniq](https://community.thunkable.com/u/peterjamesleniq)
#### Post date: [July 6, 2024, 5:53am UTC](https://community.thunkable.com/t/solved-intro-to-sizing-snap-to-place-thunkable-docs/3082155/8 "2024-07-06T05:53:35Z")

</div>

Hi Matt,  
[ioannis](https://community.thunkable.com/u/ioannis) should me where I was going wrong.  
All is good now.  
Thanks for replying.

---

<div class="post-metadata">

### Author: ![ioannis](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/ioannis/32/146956_2.png) [@ioannis](https://community.thunkable.com/u/ioannis)
#### Post date: [July 8, 2024, 12:50pm UTC](https://community.thunkable.com/t/solved-intro-to-sizing-snap-to-place-thunkable-docs/3082155/9 "2024-07-08T12:50:03Z")

</div>


