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 being responsive when it's viewed on mobile devices

    Asked by kauseway on November 29, 2014 at 02:12 PM

    Trying to get this form to look good on web as well as phone. I tried adding the responsive form widget with no luck. Tried to set width and max width to 100% in the css.  The credit card widget seems to be what is causing it to look bad.  Can you guys offer any suggestions here? thanks!

     

    https://secure.jotformpro.com/form/43324359969973

    Page URL:
    https://secure.jotformpro.com/form/43324359969973

    credit card thanks secure.
  • Profile Image

    Answered by raul on November 29, 2014 at 07:37 PM

    Upon checking the direct URL of your form, I see that the form is being responsive when viewed on mobile devices.
    Do you have the form embedded on a website? If so, could you please provide us the URL so we can test it there too?

    We'll await for your response.
    Thanks.

  • Profile Image

    Answered by kauseway on November 30, 2014 at 07:58 PM

    Yes I do:  https://naturalcarecleaningservice.com/book-now-checkout/

     

    I tried to insert css coding into my wordpress theme, but had no affect.  Thanks

     

    #booknowcheckout {

       width: 100%; !important

    max-width: 500 px;

    }

  • Profile Image
    JotForm Support

    Answered by ashwin_d on November 30, 2014 at 10:29 PM

    Hello kauseway,

    I did check your web page and found that you have used script embed code.

    Please be noted that for the form to be responsive, you should embed your form using it iFrame embed code. The following guide should help you garb your form's iFrame embed code:  http://www.jotform.com/help/148-Getting-the-Form-iFrame-Code 

    Please embed your form with it iFrame embed code and see if that solves your problem.

    Do get back to us if the issue persists.

    Thank you!

  • Profile Image

    Answered by kauseway on December 01, 2014 at 04:00 PM

    thanks. I tried that and still have some issues. When I take my desktop browser and shrink the width it cuts off the address field, image buttons and the credit card widget. I have attached photos. Not sure if I need separate tickets for these but I will list.

     

    1) Form is cutoff on web browser.  On phone it is not cutoff but you have to scroll slightly left and right.

    2) The expiration month and year are way to big and touching each other. The security code is touching the CC # field.  Ideally these three should be on one line and size appropriately.

     

     

    Thanks!

  • Profile Image

    Answered by raul on December 01, 2014 at 04:35 PM

    Please change the theme on your form to Default.
    Open the form in the form editor, click on Setup & Embed, click on Preferences, click on Form Styles and look for the Themes property.

    You also need to remove the fixed width for the .form-sub-label-container class, you can see it in the form designer.

    Let us know if this helps.
    Thank you.

  • Profile Image

    Answered by raul on December 01, 2014 at 04:38 PM

    By the way, I've moved your second question to this thread: http://www.jotform.com/answers/467752 to address it properly.