What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Form width is not correct after editing in Form Designer

    Asked by JoMarVisions on October 28, 2014 at 04:01 PM

    I made some changes to the form and ever since i got on the form designer, the width is all messed up. Shows up fine on the main preview but when using the direct link, it's not showing it properly at all.

    Can you please help? Not sure what to do. I tried everything. I think there's a glitch somewhere.

    Here is the link and how it looks. http://form.jotform.us/form/40565720247150?

    I'd like to use the direct link instead of embedding the form but it's not showing correctly. Any help I would really appreciate it.


    Jo

    Jotform width Form Designer
  • Profile Image

    Answered by Ben on October 28, 2014 at 05:42 PM

    Hi Jo,

    I see what you mean. Can you tell me if this is how you wanted it to look like?

    http://form.jotformpro.com/form/43006236366955

    If it is, you can clone it to your account How to Clone an Existing Form from a URL

    or you can just inject this CSS code to your account:

    .supernova  div.form-all{
      width:290px;
    }
    .form-checkbox-item > input {
        width: 10px;
    }
    label.form-label.form-label-left.form-label-auto, div.form-input > input.form-upload {
        width: 218px !important;
    }
    div.form-buttons-wrapper > button.form-submit-button {
        border-radius: 8px;
        box-shadow: 0 1px #fff inset, 0 1px #ddd;
        padding: 0;
    }
    div.form-header-group {
        margin: 0 0 0 10px;
    }

    Do let us know how it goes and if you have any further questions.

    Best Regards,
    Ben

  • Profile Image

    Answered by JoMarVisions on October 29, 2014 at 06:27 PM

    Hi Ben! I substituted what was on the CSS code. Now the form is all purple no limits which is fine, but the title appears in a white box instead of the purple background. Not sure how to fix that. I tried.

    Thanks,
    Jo

  • Profile Image
    JotForm Support

    Answered by Welvin on October 29, 2014 at 07:30 PM

    Hi Jo,

    You shouldn't remove the existing codes and just add the ones given by my colleague. Anyway, you can just grab and clone back this form: http://form.jotformpro.com/form/43006236366955 by following this guide: http://www.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL.

    Thank you!