Mobile web app incorrect format not matching live test

I made a copy of the Chekk sample app to trial publish as a mobile web app.
The formatting in the live preview within the thunkable app is fine … but the formatting in the mobile web view has different line spacing in the label/switch list, being almost triple spaced compared to the live view … and when viewed in a desktop browser, the font sizes, field widths and list row formatting are all off. Note the wider line spacing between the switches on the live test vs. close spacing on mobile web version. There seems to be no way to change this via margins or padding. Any help appreciated.

One tip: use fit contents on rows vs. fill container to keep the parent row from being MUCH larger than the dynamic columns inside.


Hey @ptptmailj9epqr

I don’t think the switch has any margins/padding, but are you setting any margins for the other components or just rolling with the defaults? If it’s default’s then this might account for the difference between viewers.

Are you tried putting each “to-do” inside its own row and controlling the spacing at that level?

Thanks.

Ya, I do have the same problem.
https://x.thunkable.com/projectPage/613059a4e67def0011367041

This is my project , and I try to wrap the flex box. Which is fine in the website but not the app live preview. After adding some blocks, the app preview can wrap but the height is always longer than the actuall screen size, and I just find out that the text font is following our phone font size not the font size we set in thunkable. :rofl: