# \[Solved\] Problems with component alignments on browser (Web app) **URL:** \ **Category:** Questions about Thunkable X\ **Tags:** design, solved\ **Created:** [July 17, 2020, 4:24am UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909 "2020-07-17T04:24:35Z")\ **Posts on this page:** 20\ **Page:** 1
**Author:** ![gobassky](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/gobassky/32/77019_2.png) [@gobassky](https://community.thunkable.com/u/gobassky)\ **Post date:** [July 17, 2020, 4:24am UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/1 "2020-07-17T04:24:35Z")
Hi experts, First I want to say that the inclusion of the ability to make responsive web apps opened a wide range of solutions to build apps for users, so I commend the thunkable team for this. I was making a web app to compile and make a report “online” using a web browser. However, even before I start to program with the blocks, I have already hit a snag on the component layout design. Their alignments do not appear correctly on the browser as what was set in the properties. 1. The texts in the label were unable to be centered, even when “center” is selected in the properties. I have to make it centred using the screen properties, and setting it to “fit content”. Else it won’t work 2. The properties for the component height does not seem to work. e.g selected “fit content” and it will always “fill container”. using relative or absolute sizes also do not yield correct results. I cross-checked with the live test on phones. They looked correct, but not on the browser. Does anyone know how to fix this? (I am using Chrome) ![1](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/5/5/55586f396381d4e6e9952336233b921b85126dd2.jpeg) ![2](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/6/a/6a100769277e12c94540e276266616ef0769951f.jpeg) ![3](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/b/a/bad0d870acc3aa095e3b69369bd6ca3dbbd4d866.jpeg) ---
**Author:** ![domhnallohanlon](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/domhnallohanlon/32/29554_2.png) [@domhnallohanlon](https://community.thunkable.com/u/domhnallohanlon)\ **Post date:** [July 17, 2020, 11:01am UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/2 "2020-07-17T11:01:22Z")
Hey @gobassky - thanks for you kind words, glad to hear that you’re enjoying Thunkable. > [@gobassky](#): > > I cross-checked with the live test on phones. They looked correct, but not on the browser For me, this would be the main priority. Since you users won’t be using your in app in the Thunkable Web preview, the most important thing is that it looks as you intend it to when its on a device. There might be an issue with layouts/spacing on web preview, can you share this project link with us (either here, or via a PM) and we can take a closer look for you. Thanks, ---
**Author:** ![gobassky](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/gobassky/32/77019_2.png) [@gobassky](https://community.thunkable.com/u/gobassky)\ **Post date:** [July 17, 2020, 1:00pm UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/3 "2020-07-17T13:00:14Z")
Thanks. I was trying to build a web app using the full screen on the computer. Hence, was meddling the with spacings and positions of the components. Let me see if i can find more issues and PM you later. ---
**Author:** ![caminostudio](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/caminostudio/32/74734_2.png) [@caminostudio](https://community.thunkable.com/u/caminostudio)\ **Post date:** [July 17, 2020, 2:32pm UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/5 "2020-07-17T14:32:21Z")
@domhnallohanlon I´m having the same problem since yesterday. Thanks! Preview ![CapturaPreview](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/3/f/3fde08a13c7071d7c8b2f4e7e73191b631e10941.jpeg) Browser ![CapturaBrowser](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/0/a/0a205a997869b726a77adcb0adf86d759507054e.jpeg) Structure ![CapturaStructure](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/5/d/5d6d49aeadbf8decc5bcae3e530e6a7e3b98bffb.jpeg) FirstStage column has a maxWidth. Wednesday was working fine. Yesterday no more. It is a bug? ---
**Author:** ![darren](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/darren/32/69854_2.png) [@darren](https://community.thunkable.com/u/darren)\ **Post date:** [July 17, 2020, 3:33pm UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/6 "2020-07-17T15:33:07Z")
‘Fit contents’ is behaving poorly today for me on the Web Preview. In some cases it is acting as Fill Container, and in others it is does not see to be ignoring items that are not visible. ---
**Author:** ![domhnallohanlon](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/domhnallohanlon/32/29554_2.png) [@domhnallohanlon](https://community.thunkable.com/u/domhnallohanlon)\ **Post date:** [July 17, 2020, 4:27pm UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/7 "2020-07-17T16:27:56Z")
> [@darren](#): > > ‘Fit contents’ is behaving poorly today for me on the Web Preview. Thanks @darren - I’ll take a look now. @caminostudio @gobassky can you confirm whether the issue with your projects is the width being set to “Fit Contents” too? Thanks! * * * UPDATE 1: I have created a project where nested elements that have the height set to “Fit Contents” don’t seem to be displaying as expected in Web Preview: [https://x.thunkable.com/copy/efcd0eaf20628bab6a8dab094198a208](https://x.thunkable.com/copy/efcd0eaf20628bab6a8dab094198a208) * * * Update 2: Issue filed: [Fit Contents not displaying as expected on Web Preview with nested components · Issue #601 · thunkable/thunkable-issues · GitHub](https://github.com/thunkable/thunkable-issues/issues/601) ---
**Author:** ![caminostudio](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/caminostudio/32/74734_2.png) [@caminostudio](https://community.thunkable.com/u/caminostudio)\ **Post date:** [July 17, 2020, 6:03pm UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/8 "2020-07-17T18:03:41Z")
I had problem with Horizontal Alignment. I set “left”, but behaves like “Space between”. “Absolute size” problem too. Layout components with their height set to “Absolute size” are behaving like their height is “Fill Container” too. Thank ---
**Author:** ![caminostudio](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/caminostudio/32/74734_2.png) [@caminostudio](https://community.thunkable.com/u/caminostudio)\ **Post date:** [July 17, 2020, 9:35pm UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/9 "2020-07-17T21:35:47Z")
@domhnallohanlon Hi! This problem is also happening with published apps. It’s not just a problem on Web Preview. Unfortunately, my web-app is crashed since yesterday. ---
**Author:** ![kizzy](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/kizzy/32/76421_2.png) [@kizzy](https://community.thunkable.com/u/kizzy)\ **Post date:** [July 18, 2020, 12:47am UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/10 "2020-07-18T00:47:38Z")
I have a publish App ios that started giving problem last evening i been up almost 15hs trying to fix this very disappointing service ---
**Author:** ![gobassky](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/gobassky/32/77019_2.png) [@gobassky](https://community.thunkable.com/u/gobassky)\ **Post date:** [July 18, 2020, 8:19am UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/11 "2020-07-18T08:19:49Z")
[/quote] @caminostudio @gobassky can you confirm whether the issue with your projects is the width being set to “Fit Contents” too? [/quote] Yes. Actually, the issue is also with the ‘fit content’ for height as well. Now that you mentioned it does behave like “fill container”, even though 'fit contents is selected for both height and width. ---
**Author:** ![tingccc](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tingccc/32/6145_2.png) [@tingccc](https://community.thunkable.com/u/tingccc)\ **Post date:** [July 21, 2020, 3:39pm UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/12 "2020-07-21T15:39:02Z")
Hi, thank you all for all the issues reported! This helps us to keep improving, and the team will be working on it and I’ll get back to you here on the progress. Thanks! ---
**Author:** ![jamesshepherd876pnr](https://avatars.discourse-cdn.com/v4/letter/j/b77776/32.png) [@jamesshepherd876pnr](https://community.thunkable.com/u/jamesshepherd876pnr)\ **Post date:** [July 22, 2020, 8:08pm UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/13 "2020-07-22T20:08:48Z")
I’d been making an app which was first a web app to be used on a desktop and second a phone app, it basically is a flow diagram with a series of appearing boxes based on user selections. IT was all aligned well and working well as a responsive web app in preview, but i didnt look at it for a few days and when i tried it earlier this week, having not touched it inbetween, it was all out of alignment and some of the boxes were filling the space when previously they had not. I haven’t had any luck addressing it. IS this likely to return to how it was previously at some point or will i need to redo it? I have tried but having no luck getting it back to where it was. Just to say, really like the responsive web app capability though, i was about to upgrade to pro as it seemed to be functioning well enough for me to demo to people. Really hoping i can get it back to how it was. Many thanks, James ---
**Author:** ![tingccc](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tingccc/32/6145_2.png) [@tingccc](https://community.thunkable.com/u/tingccc)\ **Post date:** [July 22, 2020, 9:11pm UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/14 "2020-07-22T21:11:42Z")
Hi James, We’re sorry about it. Currently the team is looking into the layout issues on the provided projects above. If you don’t mind, would you share your project with me? You could send a private message to me as well. Thanks! ---
**Author:** ![tingccc](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tingccc/32/6145_2.png) [@tingccc](https://community.thunkable.com/u/tingccc)\ **Post date:** [July 23, 2020, 8:31pm UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/15 "2020-07-23T20:31:52Z")
Hi all, Thanks for waiting! We just released a fix regarding the layout issue in this thread. Please check your apps/projects, and let us know if you’re still experiencing this issue, so we can help to resolve it. Best, Ting ---
**Author:** ![caminostudio](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/caminostudio/32/74734_2.png) [@caminostudio](https://community.thunkable.com/u/caminostudio)\ **Post date:** [July 23, 2020, 8:55pm UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/16 "2020-07-23T20:55:26Z")
I will test now! Thanks! ---
**Author:** ![caminostudio](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/caminostudio/32/74734_2.png) [@caminostudio](https://community.thunkable.com/u/caminostudio)\ **Post date:** [July 23, 2020, 9:35pm UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/17 "2020-07-23T21:35:07Z")
Everything restored for me! Thank you!!! ---
**Author:** ![domhnallohanlon](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/domhnallohanlon/32/29554_2.png) [@domhnallohanlon](https://community.thunkable.com/u/domhnallohanlon)\ **Post date:** [July 23, 2020, 9:57pm UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/18 "2020-07-23T21:57:28Z")
Awesome, thanks for letting us know @caminostudio! > [@domhnallohanlon](#): > > I have created a project where nested elements that have the height set to “Fit Contents” don’t seem to be displaying as expected in Web Preview: I’ve tested my sample project too and it seems to be working fine for me. * * * cc: @gobassky @darren @kizzy @jamesshepherd876pnr can you take a look and let us know if that’s working for you now? Thanks! ---
**Author:** ![darren](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/darren/32/69854_2.png) [@darren](https://community.thunkable.com/u/darren)\ **Post date:** [July 24, 2020, 3:30am UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/19 "2020-07-24T03:30:06Z")
@domhnallohanlon `Fit Contents` seems to be resolved. But now I’m seeing some weird behavior with `app` level variables not being updated in some places. Here is a simple example: [https://x.thunkable.com/copy/5342a5845580e4ba8b8c12f4b14b463b](https://x.thunkable.com/copy/5342a5845580e4ba8b8c12f4b14b463b) Again this is specific to the Web Preview/Published. Reported here: > > > Platform > ✕ Web App > Steps to Reproduce > https://x.thunkable.com/copy/5342a5845580e4ba8b8c12f4b14b463b > Launch in Web Preview > Look at Label > Expected Behavior > Should show Changed Value > Actual Behavior > Shows Initial Value I also noticed every screen seems to open up twice which makes it look glitchy. ---
**Author:** ![gobassky](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/gobassky/32/77019_2.png) [@gobassky](https://community.thunkable.com/u/gobassky)\ **Post date:** [July 24, 2020, 5:34am UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/20 "2020-07-24T05:34:17Z")
Hi Domhnallohanlon, Thanks for the prompt fix. Layout wise it seemed to work well i.e. he “fit contents” worked as expected on the responsive web preview. However, the text alignment for properties in labels still is not working on the webapp. i.e cannot “centre”, “left” or “Justify” the text tabel. The work around that needed to be done is to put the label in the row or column and align the label component instea, very tedious but appearance wise, it works But I also encounter a more serious problem for my webapp. After this update, I realised that the “app” type variables values were not passed across screens. Whereas, previously is was working. Testing this on the phone live test, the variables can be used across the different screens. Given that Webapp does not have local saved variable functions, how to then work around this issue? Thanks. ---
**Author:** ![ioannis](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/ioannis/32/146956_2.png) [@ioannis](https://community.thunkable.com/u/ioannis)\ **Post date:** [November 8, 2024, 12:27pm UTC](https://community.thunkable.com/t/solved-problems-with-component-alignments-on-browser-web-app/683909/21 "2024-11-08T12:27:03Z")