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

    How do I get rid of the frustrating white background?

    Asked by ChecMark on May 04, 2014 at 06:32 PM

    I can't find a setting anywhere and I can't find it in the CSS. I wanted to change the form's width, but the white background stays the same. If you look at the only form I have you will see some obvious problems I'm having with alighning the fields on the same line.

    I am currently using FormSite to create forms, but it is very expensive. I need multi field lines and to be able to set the overall width of the form on my page to 980px.

    A bug discovered today resulted in this -

     

    Screenshot
    create forms create find same line
  • Profile Image
    JotForm Support

    Answered by jonathan on May 04, 2014 at 08:20 PM

    Hi,

    You did not mentioned what color you need for the html background color of the form.

    If this is the form http://www.jotform.ca/form/41237362363249  you wanted to apply the CSS code background color, please try adding this CSS code into those existing in the form already

    body, html {

    margin: 0;

    padding: 0;

    background: #57a700 !important;

    }

     

    I used this on the test form and the background become like this

     

    Please try it on your form also. Inform us if it does not work.

    Thanks.

     

    --

    The bug you mentioned was already submitted with a ticket. To get rid of it, just click on the OK button so that the color picker dialog can be closed.

  • Profile Image

    Answered by ChecMark on May 06, 2014 at 07:05 AM

    No, it is the other form. The fields all have a background blocking that is not the general background color, which is what I want. 

  • Profile Image
    JotForm Support

    Answered by ashwin_d on May 06, 2014 at 08:44 AM

    Hello ChecMark,

    Are you having issues with this form:  http://www.jotform.ca/form/41236802378253 where the last name comes in second line.

    It is actually caused because of the css you have injected. Please take a look at the following form and see if this seems acceptable to you:  http://form.jotformpro.com/form/41254063997966?

    Feel free to clone this form for a closer look. The following guide should help you in form cloning:  http://www.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL

    Hope this helps.

    Do get back to us if you have any questions.

    Thank you!

  • Profile Image

    Answered by ChecMark on May 06, 2014 at 10:07 AM

    Pretty sure that the only CSS I added was given by you. There are two issues wit your suggestion; one, I would likr the fields to be side by side as I designed, but aligned properly and, two, this is a major issue with creating complex forms that I have asked several times with no answer. I don't want to keep repeating myself and I sent a sample of the form on another thread. 

  • Profile Image

    Answered by EliezerN on May 06, 2014 at 11:51 AM

    @CheckMark

    I have resolved the field alignment issue on a cloned version of your form, here it is: http://form.jotform.co/form/41254169315856

    You can simply clone my form and use it for your needs. Here is how to clone it: How to clone an existing form from a URL.

    This is the CSS code I used:

    #id_8
    {
    margin-left:-3px !important;
    margin-top:0px !important;
    background-image:url('https://shots.jotform.com/eliezer/newscreens/field_background.png') !important;
    background-size: 191px 6px !important;
    height:51px !important;
    }

    Thanks.