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

    I do I make my new form responsive?

    Asked by sgonzal on April 10, 2014 at 03:18 PM
    new form
  • Profile Image
    JotForm Support

    Answered by KadeJM on April 10, 2014 at 04:07 PM

    Did you mean " How " instead of I? Your form should already be responsive for the most part.

    I found you have one form on your account which works well on my end. Is this the form you were having some sort of issue with and if so can you please describe the problem to us more?

  • Profile Image

    Answered by sgonzal on April 10, 2014 at 05:04 PM

    Yes KJM, i saw that I had "I" instead of "How", my apologies.

    And thanks, for the quick response.

    When I was creating my form, I didn't see an option for responsive capability, and so I was just curious. Yes, this is the form in question. It's 260px wide, but when the page that  the form resides on scales down to satisfy the media, the form itself doesn't. Or at least, it appears that way. I believe I may have determined what the issue is. I believe it may be something on my end. I will get back to you.

    Again, thanks for the response.

    SGE

  • Profile Image

    Answered by sgonzal on April 10, 2014 at 05:54 PM

    Hello JKM,

    I looked into it, and it wasn't what I thought it was. It appears that in the media screen size with a max-width of 758px and a min-width of 524px that the form is not scaling down.

    Here is a demo link of the page: http://www.jacksonlawatx.com/demo3.html 

    Please take a look at it in that media size and let me know what you think.

  • Profile Image
    JotForm Support

    Answered by jonathan on April 10, 2014 at 09:01 PM

    Hi SGE,

    Please refer also to this thread for more helpful details

    -How-to-make-the-form-mobile-responsive

    You can inject CSS code to the form to make it responsive according to the device browser type it will be viewed.

    --

    I did checked your form http://www.jotform.us/form/40994427573162 already, but I noticed that there was no included media CSS code into it yet. You can further enhance this via CSS code as described on the other thread I suggested.

    Hope this help. Inform us if you need further assistance.

    Thanks!

  • Profile Image

    Answered by sgonzal on April 11, 2014 at 03:30 PM
    Hello Jonathan,
    thanks for the tip.
    Using FF firebug to determine the proper class tag, I modified the
    .form-all class to fit in a media screen size of max-width of 758px and
    min-width of 524px. However, after making this change, it appears to have
    no effect. The input fields scaled down, but the other elements didn't.
    Here is the link to the demo page: http://www.jacksonlawatx.com/demo3.html
    Please look at it and let me know what you think.
    thanks
    SGE
    ...
  • Profile Image
    JotForm Support

    Answered by jonathan on April 11, 2014 at 04:53 PM

    Hi,

    I need clarification regarding your requiremernt. 

    If I undertand correctly, what you wanted to achieve is make the form wider to 758px according to the browser type being used?

    I initially thought it was the other way around, that is make the form responsive by scaling down according to the browser i.e. when in mobile device browser.

    You can actually set the actual height of the form to 758px instead, and then inject the CSS code to have scaling down responsiveness.

    Please update us.

    Thanks.

  • Profile Image

    Answered by sgonzal on April 11, 2014 at 05:10 PM
    You are understanding me correctly. I am wanting the form to scale down to
    fit in a media screen width of max-width of 758px and min-width of 524px. I
    didn't change the height of anything as far as the form goes. Nor do I want
    to at this time.
    thanks
    ...
  • Profile Image
    JotForm Support

    Answered by TitusN on April 11, 2014 at 06:23 PM

    Hello,

    Each field container on your form has to be instructed to either inherit the parent width settings, or respond resposively using width:100% - fitting the parent container - even as it adjusts to a minimum or maximum.

    I checked your form, but could not see what you are reffering to - which fields are not scaling into the set width?

    Looking forward to your response.

  • Profile Image

    Answered by sgonzal on April 14, 2014 at 02:40 PM
    Hello,
    yes, the form looks fine in all of the sizes except for the 758px to 524px
    screen size.
    Also, it appears that the form information is coming/going to the jotform
    account email that was submitted, which is my email. This information needs
    to go to the email address that is on the following page:
    http://www.jacksonlawatx.com/contact_us_form_mail.php
    And that email is: allison@jacksonlawatx.com
    Let me know if you have any questions.
    thanks so much!
    ...
  • Profile Image

    Answered by jedcadorna on April 14, 2014 at 03:43 PM

    Try adding !important to your width. That would be something like this width:100px !important. I was testing your form and site and it seems fine even on mobile.

    Which device do you test your site by the way? About your 2nd that you don't receive an email notification kindly create a seperate thread for that please use this link http://www.jotform.com/contact.

  • Profile Image

    Answered by sgonzal on April 14, 2014 at 05:00 PM
    Hello,
    Since I do not have a device that uses a screen width size of 758px to
    524px, I just manually scale down the window in my browser to the screen
    width size.
    Concerning the email link, that link you sent me goes to JotForm's 'Contact
    JotForm Support' page. Is this the correct one you were wanting to send me?
    thanks
    ...
  • Profile Image
    JotForm Support

    Answered by Welvin on April 14, 2014 at 06:02 PM

    You can use the browser emulator for Google Chrome and Mozilla FireFox if you do not have the actual mobile device:

    For Google Chrome: Press F12 > Press Escape button to open emulation tab. From there, you should be able to select a device to emulate:

     

    For Mozilla Firefox: Press CTRL + SHIFT + M

     

    That is the link to a page for sending an inquiry to our support forum. Use it for posting your issue with the form notification.

    Thanks

  • Profile Image

    Answered by sgonzal on April 14, 2014 at 06:50 PM
    Ok, thanks!
    ...