Layout bug when previewing

Project link: Thunkable

image

I have a layout set up like this next screenshot, with Column1 (orange) set to 80 pixels height and Button1 (green) set to 80 pixels height and 60 pixels width inside Row1 (no color) set to Fit Contents height that is then inside Column2 (yellow) set to Fit Contents height. All column and row widths are set to Fill Container.

Below is the Live Test in Thunkable Live on the left and the browser Preview on the right:

Why are these so different? I would expect both screenshots to look like the Thunkable Live screenshot on the left. It seems like the browser Preview is not respecting the height properties for any of the row or column components.

1 Like

If I remember correctly, there is a layout bug when using a specific size in one side and Fill container in the other. You need to set the width to relative 100%. The screen scroll should be false too.

Yes, you’re correct. Scrollable was false but when I change the width to relative 100%, it fixed the preview issue.

Also reported here: Previewed row & column heights aren't accurate · Issue #1121 · thunkable/thunkable-issues · GitHub

1 Like