Component padding inside container acts as margin

If I add a label or text input to a container (in a Layout) and set the label or text input’s padding value, Thunkable treats it like a margin rather than padding:

The 15 pixel top Padding should not act similar to the 15 pixel left Margin. Instead, the letter “L” in “Label” should be 15 pixels to the right of the label’s left border. In the screenshot, it’s 0 pixels to the right of it.

Here’s a project that demonstrates this: Thunkable

I also submitted a bug report for this: Component padding inside container acts as margin instead · Issue #1268 · thunkable/thunkable-issues · GitHub

Reference:

Hello @tatiang!
We appreciate you taking the time to investigate and provide more information.
We can understand that it is frustrating, and I will do my best to explain how it works.
As you mentioned, padding is adding space between the content and the edge of a component. In order to test it, I suggest adding a border in the component you want to check padding, so you can see where is the edge of the component.

After that, I suggest testing it and not staying on the appearance you see on the editing page.

I checked this project and had no issues.
https://x.thunkable.com/projects/647771cd316899304fd2a662/e3961e29-b22a-4130-8d76-e158a89ff721/designer

It is weird, I know, but it works.

Okay, I think part of the problem is that padding and margins do not display correctly in Preview. Can that be fixed?

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.