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

    Form is not mobile responsive

    Asked by skatch on December 03, 2015 at 04:43 AM

    I have exactly the same issue. It is not noticeable on desktop, but when running on mobile, particularly in portrait mode, the form is clearly shifted to the right:

    https://form.jotform.me/53341980197461

    Width is set to 100%, so that can't be it.

    Any help greatly appreciated!

    mobile mobile responsive not responsive buttons responsive
  • Profile Image
    JotForm Support

    Answered by Jan on December 03, 2015 at 06:02 AM

    I can see that there is a problem with the buttons on your form when I view it on smaller devices. Here's a screenshot:

    Please use this custom CSS code that targets mobile screen devices.

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

    .form-pagebreak {
    margin: 0 0 !important;
    }

    .form-all .form-pagebreak-back-container, .form-all .form-pagebreak-next-container {
    width: 280px !important;
    }

    .form-pagebreak-next-container {
    padding: 0 !important;
    }

    .form-pagebreak-back-container {
    padding: 0 !important;
    }

    .form-all .qq-upload-button, .form-all .form-submit-button, .form-all .form-submit-reset, .form-all .form-submit-print {
    width: 280px !important;
    padding: 0 !important;
    }

    }

    Here's a guide on how to inject custom CSS on your form. Here's the result:

    Hope this helps. Let us know if you have any questions. Thank you.

  • Profile Image

    Answered by skatch on December 03, 2015 at 10:14 PM

    Hey Jan,

    Thanks a lot for the prompt response. This workaround only solves the issue in the simulator but not on my actual Android test device (galaxy A8) (I suppose it is because it has a higher-res screen).

    However, your answer made me realize that this "right shifting" bug is indeed related only to the buttons (i.e., not the entire form), AND, it only occurs when the buttons exceed a certain width.

    ==> By not exceeding a certain button width (around 280 pixels maybe), the buttons appear centered, i.e., no right shifting bug.

    So, I am happy enough : ).

    Thanks again.

      

  • Profile Image
    JotForm Support

    Answered by Charlie on December 04, 2015 at 02:50 AM

    In behalf of my colleague, you are welcome. And thank you for sharing us your findings on this, other users might see your post helpful if they encounter a similar case.

    If you need any assistance again, please do not hesitate to open a new thread here in the forum.

    Cheers!