# \[Solved\] Why doesn’t my app look the same in Companion app and live preview on web? **URL:** \ **Category:** Questions about Thunkable X\ **Tags:** solved, draganddrop, ui\ **Created:** [April 5, 2022, 8:05am UTC](https://community.thunkable.com/t/solved-why-doesn-t-my-app-look-the-same-in-companion-app-and-live-preview-on-web/1818259 "2022-04-05T08:05:08Z")\ **Posts on this page:** 5\ **Page:** 1
**Author:** ![random.rrr3r7](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/random.rrr3r7/32/45151_2.png) [@random.rrr3r7](https://community.thunkable.com/u/random.rrr3r7)\ **Post date:** [April 5, 2022, 8:05am UTC](https://community.thunkable.com/t/solved-why-doesn-t-my-app-look-the-same-in-companion-app-and-live-preview-on-web/1818259/1 "2022-04-05T08:05:08Z")
Hi all, I was recently developing apps used in educational settings with Thunkable Drag and Drop, and noticed some issues with the User Interface (UI) being out of place on Live Previews. My app looks perfectly fine on Web Preview: ![Screenshot 2022-04-05 at 1.24.42 PM](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/9/7/97cdb87e3a62acbd160642e9912ca0f881aba9b0.jpeg) However, I have noticed that while running Live Preview on iOS, many UI elements such as buttons, groups and images tends to be compressed vertically. The other major issue with this is that the switch element is completely misplaced. ![2022-04-05 13.46.01](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/4/d/4d1c507c64e104ea72f842d32f6957b326d03955.jpeg) Notice how the text in the button below is not centered: ![2022-04-05 13.48.50](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/5/6/56441eb2390e7ab9cec16bc9d78894efb016d94d.jpeg) This issue appears to be more obvious in the iOS version of Thunkable Live, but Android still has issues with switch misplacement: ![WhatsApp Image 2022-04-05 at 2.45.55 PM](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/9/6/96b337e0f77444a6aaa592be40577a38ef974237.jpeg) My app is available for cloning at [https://x.thunkable.com/copy/bbc5d6e71b36ed1c96a4c1747c667661](https://x.thunkable.com/copy/bbc5d6e71b36ed1c96a4c1747c667661). Hopefully there’s a fix for this issue, or perhaps a temporary solution I can use before the Thunkable team fixes it. Thanks in advance 🙂 ---
**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\ **Post date:** [April 5, 2022, 12:00pm UTC](https://community.thunkable.com/t/solved-why-doesn-t-my-app-look-the-same-in-companion-app-and-live-preview-on-web/1818259/2 "2022-04-05T12:00:46Z")
Hey @random.rrr3r7 👋 Thanks for this great question. This topic has come up a lot over the years. It’s my view that the companion app is best suited for testing your apps functionality on a mobile device allowing you to use the Sensors, BLE, GPS, camera, etc. The live preview on web is better suited for seeing how your app will appear when it’s finally published and installed on a device. We continue to work towards making the companion app appear more like the live version. In fact, this was a topic of discussion in the last month. So, we acknowledge the parities and are always working on improving the experience as much as we can! Are the differences prohibiting you from being able to publish your app? ---
**Author:** ![random.rrr3r7](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/random.rrr3r7/32/45151_2.png) [@random.rrr3r7](https://community.thunkable.com/u/random.rrr3r7)\ **Post date:** [April 5, 2022, 1:41pm UTC](https://community.thunkable.com/t/solved-why-doesn-t-my-app-look-the-same-in-companion-app-and-live-preview-on-web/1818259/3 "2022-04-05T13:41:59Z")
Hi, thanks for the reply! Appreciate it. For my use case, I am deploying it in an educational context for grade school students to learn app development and to pair it with IoT devices. As such, the students would not typically be publishing those apps, but will mostly use it with Live Preview. I managed to hack together a solution for the switch misplacement issue that might work for those using Live Preview, which is to place the switch within a Group and continuously adjust the borders of the Group while previewing it on your phone, so that the switch is more or less in the same position for both Live Preview and Web Preview. This might not work in other designs requiring a more responsive app, but does work in a pinch… ![Screenshot 2022-04-05 at 9.41.14 PM](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/5/c/5c91eb16cfcb1f8a331fa5bebf32959295e0d516.jpeg) ---
**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\ **Post date:** [April 5, 2022, 2:08pm UTC](https://community.thunkable.com/t/solved-why-doesn-t-my-app-look-the-same-in-companion-app-and-live-preview-on-web/1818259/4 "2022-04-05T14:08:47Z")
Thanks for the context @random.rrr3r7 and we appreciate your understanding here! This sounds really cool and we would absolutely love to hear progress on how the course goes! ---
**Author:** ![system](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/0/f/0f59f292712368bce16ff80133ae10de8a6f27e8.png) [@system](https://community.thunkable.com/u/system)\ **Post date:** [July 4, 2022, 2:08pm UTC](https://community.thunkable.com/t/solved-why-doesn-t-my-app-look-the-same-in-companion-app-and-live-preview-on-web/1818259/5 "2022-07-04T14:08:52Z")
This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.