Issue with Advance vs. Builder

  • HolySpiritEncounter
    Asked on August 17, 2020 at 2:06 PM

    I'm unable to get the form to hold any changes made in Advance mode. This is most noticeable with changes made on the Form Layout tab: lacks rounded corners, input width changes, and columns. See attached, which is from the advance pages vs the URL is the final product form builder. Thanks

    Jotform Thread 2518073 Screenshot
  • KrisLei Jotform Support
    Replied on August 17, 2020 at 6:50 PM

    Hi,

    I am able to replicate the issue on my end when I cloned your form:

    1597704120form Screenshot 10

    However, it seems that when switching to preview mode from the Advanced Designer it is showing a similar output with the published form:

    1597704342advanced Designer Screenshot 21

    I can see that you are using the Simplicity Theme for your form, may I ask which format or layout do you prefer? It seems the layout is changed while on the Advanced Designer but they have the same output. 

    Looking forward to your response. 

  • HolySpiritEncounter
    Replied on August 18, 2020 at 9:28 AM
    My preference is the Advance designer look, not the preview output. We want
    the rounded edges and the 3 columns that display with the City, State, and
    Age. It looks cleaner. But I've also noticed that forms that were designed
    with a correct output a while back are now messing up too if I edit and go
    into Advance (even with no changes). When I create new forms, I will open a
    previous form to reference the setup. When I open an older form that was
    designed and displayed correctly, now it messes up and becomes wonky in the
    output, even if I do not make any changes to it.
    ...
  • Johann_A
    Replied on August 18, 2020 at 10:56 AM

    Greetings, 

    I could fix the issue by adding this CSS code: 

    #label_10 {

        width : 100%;

        max-width : 250px;

        box-sizing : border-box;

    }


    1597762179Screenshot 2020 08 18 15 48 39 Screenshot 10

    1597762545test css Screenshot 21



    GuideHow-to-Inject-Custom-CSS-Codes

    Please let us know how it goes. 

    Johann

  • HolySpiritEncounter
    Replied on August 18, 2020 at 11:28 AM
    This does seem to work. Still not ideal in alignment, but will work. So I
    will need to add the code to every form I create?
    ...
  • Johann_A
    Replied on August 18, 2020 at 12:49 PM

    I cannot ensure that you have to add this code every time, because I applied this code to put the Age field on the right. If you do not have the same Age field it will not work the same. 

    Do you need more assistance?

    Johann. 

  • HolySpiritEncounter
    Replied on August 18, 2020 at 3:28 PM
    No more assistance needed thanks!
    ...