How to make the Form mobile responsive?

  • murielperez03
    Asked on June 26, 2019 at 11:42 AM

    I'm really tired of figuring this out on my own. Can someone please help me?

    In my form, when someone selects a product to order, there are four fields to fill up that will appear.

    Without the mobile responsiveness widget, the second field is visually cut, while the third and fourth are no where to be seen on a mobile screen.

    With the mobile responsiveness widget, the second field is visually whole, while the third and fourth are still no where to be seen on a mobile screen. This is so even when i try to scroll right.

    https://form.jotform.me/91622788526467

    P.S. i can't figure out how to get the preview before submission working right. The submit button gets in the way visually of the edit button. I've been trying to figure this out for weeks. Please help.

  • roneet
    Replied on June 26, 2019 at 1:48 PM

    On testing the Form I noticed it requires some CSS injection to make it mobile responsive. Please allow me some time to test and get back to you.

    Thanks.

  • roneet
    Replied on June 26, 2019 at 3:30 PM

    There are lots of CSS code which is causing conflict with the elements in the field. I tried to remove some and make it best fit on mobile screens.

     

    1561577117save Screenshot 10

    I have also fixed the review order widget to made it mobile responsive.

    1561577245save Screenshot 21

     

    Removed some CSS and added the below code:

    #input_75{

      height: 50px;

    }

    Please refer to the cloned form and make changes to your form accordingly https://form.jotform.com/91765973621972 

    Let us know if you need more assistance. 

    Thanks!