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

    Placing two fields on the same line

    Asked by commercialkings on September 28, 2016 at 02:41 PM

    How can I get the DROP 1 VOICE Box to be on the same line as the DROP 1 SCRIPT Box? I've tried to make the width of both smaller. Can't get it to work. 

    Page URL:

  • Profile Image
    JotForm Support

    Answered by Mike on September 28, 2016 at 09:28 PM

    Your form theme sets a 100% fields with.

    As a workaround, you can set some fields to the 50% width using CSS in form designer. Go to the CSS section in form designer, double-click on the field and set a 50% width.


    Thank you.

  • Profile Image

    Answered by commercialkings on September 29, 2016 at 09:43 AM

    Thanks for your response, but this now leads me to a new issue. When I pull up designer, I can't even see the fields I want to edit. 


  • Profile Image
    JotForm Support

    Answered by Chriistian on September 29, 2016 at 12:40 PM

    I cloned your form and I was able to see what you are reporting. Some fields are missing in the Designer mode of the form.


    I have moved the new issue that you encountered on a separate thread so we can better investigate the issue. You can check the thread here: https://www.jotform.com/answers/945687.

    For now, can you try to add/inject the following CSS code in your form to align the DROP VOICE Box fields and DROP SCRIPT Box fields?

    #id_10,#id_11,#id_12,#id_18,#id_16, #id_22, #id_15, #id_21, #id_17, #id_20, #id_14, #id_19 {

        width: 50% !important;



    Just copy the provided code above and paste it after all the custom CSS code in your form.


    For more information, you can check this article: How to Inject Custom CSS Codes.

  • Profile Image

    Answered by commercialkings on September 29, 2016 at 01:50 PM

    Thanks. It worked, but now the boxes are very far apart and look funny. How can I fix that?

  • Profile Image
    JotForm Support

    Answered by Mike on September 29, 2016 at 03:39 PM

    You can try the next CSS instead where the width for text boxes is set to 50% and 200 pixels for drop downs.

    #id_11, #id_18, #id_22, #id_21, #id_20, #id_19 {
    width : 50% !important;

    #id_10, #id_12, #id_16, #id_15, #id_17, #id_14 {
    width : 200px !important;