How do I make my form responsive?

  • Profile Image
    entechjax
    Asked on January 29, 2014 at 07:40 PM

    I have tried everything, but I cannot get this form to fit in a mobile browser. It cuts off the weekdays on the preffered service day and it cuts off the "please note ...." text near the endo of the form. My website is fully responsive using the twitter bootstrap design, but the form is not. I have embeded as iframe.

    This page on my website is completely unresponsive. I am not a developer, so probably broke something :)

     

    Screenshot of iPhone on form included ...

  • Profile Image
    Cesar
    Answered on January 29, 2014 at 10:53 PM

    I've injected the following CSS code to your form:

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

    So far I have viewed the through 2 android phones and a Nexus7. The only device that needed the reponsive width was the Nexus7. The smaller devices already viewed the frm properly.

    Do let us know which devices you are testing with. Kindly let us know if the CSS code I've injected to the form works for you or if you need further assistance. Thank you-

    Related Article:

    Customize-your-Form-using-Custom-CSS-Codes

    How-to-Inject-Custom-CSS-Codes

  • Profile Image
    universalprofessionaltraining
    Answered on August 16, 2014 at 10:19 AM

    I added this code to my form and it did not make it responsive. I am using boot strap but thus far this is the only thing on the page I have been unable to make responsive. I have attached a screenshot of my form. Any help would be greatly appreciated.

     

  • Profile Image
    jonathan
    Answered on August 16, 2014 at 06:38 PM

    @ universalprofessionaltraining

    Hi,

    I created a separate post for you here http://www.jotform.com/answers/417038

    We will reply to you on that post as soon as we can.

    Thanks.