Components do not display properly in preview

Can anyone please help me figure this out?
On the Adalo builder, my components are well-aligned, but when I test on the preview, they are misaligned and some shapes and sizes change.
How can I fix this?

Hey Uitty, all the components has a Style button to be configurated, display bottom, or top, and also padding And border. Try to start from here and see if this works.

We understand the learning curve is a bit high to get these things working properly but there are some small tricks to get you started:

  1. Always “snap” elements to line up with each other
  2. Try to keep certain elements to be the same width or height
  3. Group elements together
  4. Use a shape as a “container” as the background for other elements inside of it. (Then group them all together).
  5. When using visibility settings, try placing items either directly to the side of the other element or directly below it.

Thanks @Colin. I have tried to snap and group elements. On the first few previews, everything looked right. But now, it’s all skewed. I’ll try adding a container and see if it works. I’m most worried that sometimes everything appears well-aligned and other times, not. I wouldn’t want components moving after the app goes live.

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