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 to aligning product quantity boxes on same line as products?

    Asked by dellquaysc on March 03, 2015 at 12:33 AM

    This no longer works.

    even experimenting with the values results in "quantity" field no longer visible...HELP

     

    Mike

  • Profile Image
    JotForm Support

    Answered by ashwin_d on March 03, 2015 at 12:36 AM

    Hello Mike,

    Is the problem related to form "Clone of Junior Week 2015"? 

    Please delete all the custom css code you have in your form and add the following custom css code:

    .form-product-item .form-sub-label-container {margin: 3px 9px 1px 6px !important;

    position: absolute;

    top: 0px;}.form-product-item .form-checkbox {vertical-align: middle !important;margin-top: -3px !important;}

    .form-product-item br {display: none !important;}

    .form-product-item {width: 316px !important;margin-bottom: 1px !important;

    height: 25px !important;

    }

    Please check the screenshot below for the output of the above css code:

     

    Hope this helps.

    Do get back to us if you have any questions.

    Thank you!

  • Profile Image

    Answered by dellquaysc on March 03, 2015 at 08:06 AM

    Hi - thanks for the quick reply.

    Actually, the problem is in the "Junior Week 2015" form, which is this one:

    http://form.jotformpro.com/form/50593564611961

    just that I cloned it first before experimenting with CSS values so I would not mess up the 'real' form

    Thank you for your code, which I have applied to Junior Week 2015 (not the clone) and it worked fine for the first couple of products only, then I experimented some more and got i apply to all products shown.

    I cant get the quanity drop down field correctly placed however, I would like them aligned to the same horizontal position - can you help me with that ?

     

    Mike

     

     

  • Profile Image
    JotForm Support

    Answered by ashwin_d on March 03, 2015 at 09:37 AM

    Hello Mike,

    Please take a look at the following cloned form and see if the quantity drop down appears correctly:  http://form.jotformpro.com/form/50613661117953? 

    Do get back to us if you need any other changes.

    Thank you!

  • Profile Image

    Answered by dellquaysc on March 03, 2015 at 09:59 AM

    Hi

     

    Thank you for this, I managed to achieve pretty much the same through experimentation myself here: http://form.jotformpro.com/form/50593564611961

     

    but the quantity drop down is tight up against the price. How to create a space between and have all quantity drop down fields aligned vertically plse?

     

    Mike

  • Profile Image

    Answered by Shadae on March 03, 2015 at 11:27 AM

    Hi Mike, 

    Please replace the current Custom CSS code that you have injected in your form with the following code that was used in my colleague's form:

    .form-product-item .form-sub-label-container {

    padding: 0px 5px 5px 5px !important;

    position: absolute;

    top: -1px;

    }

    .form-product-item .form-checkbox {vertical-align: middle !important;margin-top: -3px !important;}

    .form-product-item br {display: none !important;}

    .form-product-item {

    width: 450px !important;

    margin-top: 4px !important;

    height: 30px !important;

    }

    .form-description {

    top: -5px; right:-1px;

    width: 300px ;max-width: 300px

    }

    I hope this helps, please inform us if you need further assistance.