Form is very long on smaller screen size

  • TCCSlinda
    Asked on July 6, 2016 at 3:13 AM

    Hello, Im not sure what the problem is, but this form on my homepage is stretched so long that it also streched my banner image. ive attempted to custom code the css, can someone take a look at my form? thanks

  • Chriistian Jotform Support
    Replied on July 6, 2016 at 6:25 AM

    I checked your form (http://www.jotform.ca/form/61738501664256) embedded to your website (http://www.totalcanadiancreditsolutions.com/) but I was not able to see any banner to the form. 

    Form is very long on smaller screen size Image 1 Screenshot 30

     

    And as per checking the site, it seems that the form was displayed fine on smaller screen size properly.

    Form is very long on smaller screen size Image 2 Screenshot 41

     

    Are you still encountering the issue? If the issue still persists, can you provide us the screenshot of the issue so we can further check it. To add a screenshot on this thread, just follow the instructions provided in this article: How to add screenshots images to questions to the support forum

     

     

  • TCCSlinda
    Replied on July 12, 2016 at 1:33 AM

    Form is very long on smaller screen size Image 1 Screenshot 20

  • Chriistian Jotform Support
    Replied on July 12, 2016 at 2:56 AM

    I checked your form on different screen sizes but I was still unable to replicate the issue. No images were stretched per my tests.

    Form is very long on smaller screen size Image 1 Screenshot 20

    Can you please provide further details regarding the screenshot from your last response so we may better assist you? I will wait for your reply.

  • TCCSlinda
    Replied on July 12, 2016 at 9:38 AM

    i set the line spacing as 0px, but it looks like its stretched and i couldnt figure why

  • Welvin Support Team Lead
    Replied on July 12, 2016 at 11:23 AM

    I also cannot replicate the problem on multiple browsers and OS. What is your browser and OS in the given screenshot? 

    I also checked your page source and found out that you modified the iframe codes, please try re-embedding the form again. See if that helps. 

    https://www.jotform.com/help/148-Getting-the-Form-iFrame-Code 

  • TCCSlinda
    Replied on July 19, 2016 at 2:17 PM

    I've re-embedded the form, still the same... this is so weird

  • Welvin Support Team Lead
    Replied on July 19, 2016 at 3:00 PM

    Is it on iPhone or Android? What is OS version? What is the browser? Let us know so we can check this for you. 

    Also, try injecting the following custom CSS codes to your form:

    @media only screen and (max-device-width: 768px) {

    .form-line { 

    padding: 0 5% !important; 

    }

    li#id_16, li#id_17, li#id_18, li#id_19, li#id_20 {    

    margin-bottom: -14px !important; 

    }

    }

    Here's how to inject: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes