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 get 'submit' button to auto resize for tablet and mobile view?

    Asked by adnan99 on April 24, 2016 at 03:27 PM

    Hi, 

     

    So I've created a form using jotform. The form works great in every aspect, except my submit button does not auto resize when using a mobile device or tablet. 

     

    The questions within the form, resize perfectly, but the 'submit' button does not. 

    Please can you assist, as on all mobile and tablet devices, the button extends beyond the side of the page. 

     

    Here is an example of the form within my site. ( I had even tried to place the form within an 'element' box, but it did not have the desired effect) 

     

    http://homeonlinemarketings.com/done-for-you-2-3/

     

    The website below, is an example of how the button should resize itself, when using mobile view. 
    http://dcrmarketing.com/svq/

     

    I've also attached a picture to illustrate how the button looks on mobile view. 

     

    Thanks

     

    Adnan

     

    Page URL:
    http://homeonlinemarketings.com/done-for-you-2-3/

    Screenshot
    Mobile and mobile view auto resize submit
  • Profile Image

    Answered by Carina on April 24, 2016 at 04:48 PM

    Please try adding the following css code:

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

    {

    .form-all .qq-upload-button,

    .form-all .form-submit-button,

    .form-all .form-submit-reset,

    .form-all .form-submit-print {

    height: 40px;

    width: 100% !important;

    padding: 12px 18px;

    font-family: "Arvo", sans-serif;

    font-size: 16px !important;

    font-weight: normal;

    border: none;

    border-width: 2px !important;

    border-style: solid !important;

    border-color: #ae9c9c !important;

    }

    }

    In addition you can test and clone the demo form:

    https://form.jotform.com/61146540649962 

    Let us know if we can assist you further.