My JotForms look great on Desktop, but on mobile the width goes off the page

  • Profile Image
    gophers
    Asked on March 05, 2013 at 10:43 AM

    I tried to inject some CSS to work on 320px width iPhones to overide the iframe setting on my contact form. However I can't seem to influence how the JotForm "shrinks" to fit. It doesn't.

    Can you suggest a method to make the JotForm's width to work on a 320px width using CSS. I'm placing the form into a Wordpress site as an iframe. Here's the page in question: http://gophersonthego.com/shopping/contact-us-2/

    I'm the web developer. If you email me at info@keeneonline.com I'll be sure to get your response. Or I'll check back at JotForms if you reply there. The customer can also forward me your response if it goes there.

    Thank you.

    David Teubner

    KeeneOnline.com

  • Profile Image
    Welvin
    Answered on March 05, 2013 at 11:37 AM

    Hi David,

    Please to inject this codes to your form;

    @media only screen 

    and (max-width : 320px) {

    #input_6_addr_line1, #input_6_addr_line2 {

    width: 250px !important;

    }

    #input_6_city {

    width: 94px;

    }

    #input_6_state, #sublabel_state {

    margin-left: -52px;

    }

    #input_6_state {

    width: 138px;

    }

    #input_6_country, #sublabel_country {

    margin-left: -52px;

    }

    #input_6_country {

    width: 146px;

    }

    }

    Guide: How to Inject Custom CSS Codes

    I hope this helps. Please let us know of the results.

     

    Thanks

  • Profile Image
    gophers
    Answered on March 07, 2013 at 04:38 AM
    New response receivedMuch thanks!
    David Teubner
    12 Westlund Ave
    Keene, NH 03431
    603-762-8319
    Web: KeeneOnline.com
  • Profile Image
    sidharth_kch
    Answered on March 07, 2013 at 06:05 AM

    Glad to know that your issue was resolved.

     

    Thanks,

    Sidharth