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

    Product quantity does not appear on mobile

    Asked by Issacliu on March 09, 2017 at 07:08 AM

    Hi Jot support, I've used above code for my jotform, but quantity boxes are not displayed on form page: for reference please check my form: https://www.jotform.me/form/70670343280451

    Kindly let me know how to fix it.

    Many thanks

  • Profile Image
    JotForm Support

    Answered by Nik_C on March 09, 2017 at 10:18 AM

    I checked your form and QTY fields are showing and they look aligned to me:

    Did you resolve the issue or you had something else in mind?

     

  • Profile Image

    Answered by safewills on March 10, 2017 at 12:47 AM

    Hello, 

    I'm sorry I forgot to mention that qty boxes appear well on big screens but they are lost on mobile screen, I've added responsive code but it's not working. Can you please give me the css code that works best for mobile screens and make this qty boxes responsive.

     

    Many thanks

  • Profile Image
    JotForm Support

    Answered by EltonCris on March 10, 2017 at 01:00 AM

    Inject the following CSS codes to your form. This should fix it.

    @media screen and (max-width:480px){

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

        display: block;

        position: initial !important;

        float: none;

        margin: 10px 0 !important;

        width: 30%;

    }

    span.form-product-item {

        height: auto !important;

        width: 100% !important;

        box-sizing: border-box;

    }

    }