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

    Issues with adding fields on one line

    Asked by slave2thebean on February 03, 2016 at 06:46 PM

     Hello-

     

    I hope someone can help me with my issues. I have several things I need to accomplish and am unable to figure out. 

    1. I would like to decrease the space between the subheading and the fields

    2. I have one product that needs 3 dropdown boxes to accommodate the choices it offers. I have shrunk the field, then duplicated the dropdowns, then merge the 2nd box to the first. However, I cannot get the third dropdown box to move to the same line as the others. There isn't an option to merge - only move up which doesnt accomplish what I am trying to achieve. The form should be plenty wide enough to do this.

    3. I need to decrease the space between the other options. I have tried to adjust the padding and margins - all to no avail. 

    4. I would also like to get rid of the drop shadow around the whole form- I believe the style for that is called formall. Not sure how to achieve this.

    5. This form is being embedded on a responsive website. I need the form to fill the entire width of the webpage. I have tried setting the width to a width and also tried to set it at 100%. It doesn't seem to work. The form sits in the center of my page and doesn't fill the page.


    Thanks in advance for any assistance you can provide!

     

    Regards,

    Sarah

    fields on one line adding line on one line
  • Profile Image
    JotForm Support

    Answered by Chriistian on February 04, 2016 at 04:44 AM

    You can inject the following css to fix the alignment of the form:

    .form-header-group{

    padding-bottom: 0px!important;

    margin-bottom:0px!important;

    }

    #id_27, #id_39, #id_40, #id_31, #id_32,  #id_41 {

    width:150px!important;

    }

    #id_35{

    width:500px!important;

    }

    #id_33{

    width:100%!important;

    }

    .form-all {

    box-shadow: 0!important;

    -webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, 0)!important;

    width:100%!important;

    }

     

    How to Inject Custom CSS Codes