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

    Text Field: How To Put Several Text Field In One Row

    Asked by alvincosio on July 23, 2013 at 06:57 PM

    i want the 9 textbox (see attached pic) equally align with the textbox above. 

     

    Thanks,

    Alvin

    Page URL:
    http://www.southernindustrialandtruck.ca/forms/4577422856

    Screenshot
    textbox thanks attached 3
  • Profile Image

    Answered by jefreylandicho on July 23, 2013 at 08:18 PM

    You can achieve this result by increase your form width, decreasing and shrinking the text field width and by injecting the custom css. The CSS code you need to inject in your form style is found  below.

    .form-line.form-line-column { padding: 10px; } 

    Note: you can change the 10px value based on the preferences you would like the space between field appear.

    To increase your form width, select the Form Styles tab and click the Form Width Icon.

    To decrease the field width, select the properties tab and click the Size Icon and to shrink the field, click the Gear Icon and select Shrink.

    To Inject a Custom CSS in your form, please refer to this guide.

    The result would give similar to the form below.

    http://form.jotform.co/form/32026215327848?

    If you need further assistance, please contact us again.

  • Profile Image

    Answered by alvincosio on July 23, 2013 at 11:08 PM

    no sir, i mean not in the same row. if you will notice on my forms

    http://www.southernindustrialandtruck.ca/forms/4577422856 

     1. i have 3 textfield in one row

    2. i have 4 row

    i want my textfield reduced spaces between their rows. 

    something like this (sorry i am replying on ipad only)

    for example the line is the box, i want the spacing something like this

    _________       ___________        ___________    

    _________       ___________        ___________

    _________       ___________        ___________

    _________       ___________        ___________

     

    i hope you get me

    thanks

  • Profile Image
    JotForm Support

    Answered by EltonCris on July 24, 2013 at 02:45 AM

    Hi,

    Inject the following CSS codes to your form.

    #id_23, 

    #id_24, 

    #id_25, 

    #id_33, 

    #id_34, 

    #id_35, 

    #id_36,

    #id_40,

    #id_41,

    #id_42,

    #id_43,

    #id_44,

    #id_45{

    padding: 0 36px;

    }

    #label_34, 

    #label_35, 

    #label_36,

    #label_40,

    #label_41,

    #label_42,

    #label_43,

    #label_44,

    #label_45{

    display:none; 

    }

    Guide: How to Inject Custom CSS Codes to your Form

    Result:

    You can also use our Matrix Tool to create text box columns. It's under Survey Tools. I think this would be a lot easier without the need of custom CSS injection.

    Thanks!

  • Profile Image

    Answered by alvincosio on July 24, 2013 at 10:39 AM

    THANK YOU VERY MUCH. THAT THE WAY I WANT . :D :D

  • Profile Image

    Answered by EliezerN on July 24, 2013 at 10:50 AM

    In behalf of my colleagues let me tell you it is a pleasure to assist you. Should you have any other question feel free to contact us.

    Thanks.