How do I prevent the Submit button for overflowing the form on mobile devices

  • Profile Image
    endrinita
    Asked on February 22, 2021 at 05:18 PM

    Hello,

    The submit button is too large on mobile devices. How can I ensure that the button stays within the form width?

  • Profile Image
    gerardw
    Answered on February 22, 2021 at 11:01 PM

    I tested both your direct form link and your embedded form on an Android phone and was able to view the Submit button correctly:

    1614052755_60347d936a4c3_Screenshot_2021

    Could you test again probably using a different device? Please let us know which device and web browser you were testing on.

    Alternatively, please embed the form using the iFrame code and check: https://www.jotform.com/help/148-getting-the-form-iframe-code

  • Profile Image
    endrinita
    Answered on February 23, 2021 at 08:14 AM

    I tested the form using an Android phone as well. The issue persisted even after switching to the iFrame code.  

    Any other ideas?

  • Profile Image
    Mike_G
    Answered on February 23, 2021 at 09:50 AM

    I was able to reproduce the issue you have described when I tested it on an Android device on my end.

    1614090543_6035112f3f456_

    You can fix the issue by injecting the custom CSS codes below into your form.

    @media screen and (max-width: 480px) {
    .form-all .form-submit-button {
        min-width: 100px !important;
    }
    }

    Reference Guide: How-to-Inject-Custom-CSS-Codes

    Please give it a try and let us know if you need any further assistance.

  • Profile Image
    endrinita
    Answered on February 23, 2021 at 10:40 AM

    Thanks! This worked.