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 not responsive in mobile devices - Specially Radio button

    Asked by nimiwal on May 27, 2014 at 11:01 PM

    Please check the snapshots. http://oi62.tinypic.com/34dmot1.jpg

    Here is my form embedded http://newremotes3.4glabs.co.in/

    The issue is it is not being displayed correctly in mobile devices i.e. winodows phones and iphones.

    The Radio Button text is not adjusting. Please let me know what do I need to do.

    I am comfortable with edting css and html.

    Regards,

    Page URL:
    http://newremotes3.4glabs.co.in/

    Screenshot
    Mobile jpg check and
  • Profile Image

    Answered by Cesar on May 28, 2014 at 12:37 AM

    I do see that you have obtained your form's source code and embedded it directly on the page. We do recommend to use the iFrame Embed Method as the go to choice for mobile response forms.

    In any case, do try injecting the @media only CSS code to your form:

    @media only screen and (max-device-width: 550px){
    .form-all {
    width:200px !important;}}

    Please follow this guide on How-to-Inject-Custom-CSS-Codes for more information.
    Do let us know if you need further assistance. Thank you.
  • Profile Image

    Answered by nimiwal on May 28, 2014 at 02:48 AM

    Thank you for your response! I tried using iframe as well. Injected the custom css code as well.

    but it still runs out of the mobile screens. I searched your forum to find out that using source code was a good idea to make the form responsive but it didn't worked for me. 

    I only need Radio option text to fit the mobile screens. Rest is not an issue.

  • Profile Image
    JotForm Support

    Answered by NeilVicente on May 28, 2014 at 05:14 AM

    @nimiwal

    I have injected the following CSS to your form:

    .form-radio-item label, .form-checkbox-item label {
        display: block !important;
        margin-left: 19px;
        margin-top: -17px;
    }
    @media only screen and (max-width: 550px){
        .form-all {
            width:100% !important
        }
        .form-radio-item label {
        white-space:normal;
        }
    }

    Check out your site and let me know if you're still having issues.

  • Profile Image

    Answered by nimiwal on May 28, 2014 at 05:16 AM

    Thanks a lot dear! You have saved me! My client was almost about to go away! Thanks again!