Overlapping fields for Forms after publication. View is not the same in Studio.
Question
Application Type
Reactive
Service Studio Version
11.11.0 (Build 42742)

Hi, I need help to solve this problem that I am trying to figure out. In Studio, where I am using forms, it looks ok in terms of the layout. However, after publication, the view of the form is not what it looks like in Studio as can be seen in the attached. I have tried to change the padding and adjust the height but the view is still the same. I am wondering if anyone has encountered a similar situation like this. 

Really appreciate the help provided. Many thanks.

UserStoryDetails.png

Champion

Hi Angeline,

If it's possible, please share the oml file.

Also, you can inspect in Chrom to confirm what's happening.

Kind regards



Hello Angeline,

Could you please also check your laptop/desktop screen resolution and try with different resolution? Sometime, it cause issue in displaying the controls on the screen.

Thanks & Kind Regards,

Sachin

Hello Angeline 

Have you resolved this problem? If Not, Please ensure you are using a correct structure to create the layout. Can you share the Widget Tree of this screen to look. 


Also, if you can share the link of this scree to access... We can look into structure and CSS to share an appropriate solution 

Hi Everyone,

Thanks for your answers. Tried the Chrome settings but it did not work. The form is still messed up. Let me see how I can share as it is within my company's network and pass word is required. 

Dear Angeline

For that particular screen you can tick anonymous Access and click on open in Browser. So, it will not ask the password. Please share the Opened URL with us

This is the page where it looks ok in Studio but when published and view in Chrome, it is messed up. https://dev-apac.leap.roche.com/LCP_EMEA_BiCWizards/User_Story_View?_ts=637580642343946557

Thanks for sharing I have checked and seems there are issues with the structure and classes. 


In User Agent Stylesheet you have added one class to display them as Block which is causing the issue, instead of this inline block is solving this. Please handle that CSS. 


Also you have added Margin to Component Lebel which seems useless

 

Also, it seems the stricture is not with the correct practice for this form. 

Thanks everyone for helping. It might be easier to recreate the form and structure it better. I'll do just that. Many thanks once again. 

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.