Need help with column width on mobile

  • Profile Image
    craiggallup
    Asked on September 30, 2011 at 08:18 PM

    I am using an iframe for my quote form on a mobile site. Problem is the column width on some of the text boxes are going over the page width. Can someone help me out?

     

    Here is the site:

    m.360webdesign.com

  • Profile Image
    JotFormHelper
    Answered on September 30, 2011 at 08:20 PM

    JotForm Support Will Help You Soon!

    _____________________________________________________

    Thank You For Using JotForm And If You Have 

    Other Questions Or Comments Please Tell Us!

    ----------------

    (Im Just A Forum Helper)

    - Y H

  • Profile Image
    JotFormHelper
    Answered on September 30, 2011 at 08:31 PM

    I See And Understand Your Problem Very Well, Please Choose A Different Design And Not The XXL Form Design That Is Making It Bigger!

    I Hope This Helps!

    _____________________________________________________

    Thank You For Using JotForm And If You Have 

    Other Questions Or Comments Please Tell Us!

    ----------------

    (Im Just A Forum Helper)

    - Y H

  • Profile Image
    craiggallup
    Answered on September 30, 2011 at 10:16 PM

    I switched it to the default theme but it is still going over.

  • Profile Image
    JotFormHelper
    Answered on September 30, 2011 at 10:20 PM

    The Message Box Is Really Big, Now I Recommend Making It Small And Using A Seperate One For Your Website As Well Let Me Know How It Go's!

    _____________________________________________________

    Thank You For Using JotForm And If You Have 

    Other Questions Or Comments Please Tell Us!

    ----------------

    (Im Just A Forum Helper)

    - Y H

  • Profile Image
    craiggallup
    Answered on September 30, 2011 at 10:26 PM

    I dont mind using the same form for both. Now I set the form with to 320 and my iframe to 320. Everything looks great except for my text boxes, these continue to go over the page width and i took them down really small wihtin jotform. Its like there size is not changing through the iframe.

  • Profile Image
    craiggallup
    Answered on September 30, 2011 at 10:54 PM

    Ok I seemed to fix the columns but with the iframe width set to 320 it looks good in potrait view but when you orient to landscape it does not stretch out. Is there a fix to this?

  • Profile Image
    allanftd
    Answered on October 01, 2011 at 12:14 PM

    Hi craiggallup,

    Is it possible for you to try using the iframe embed code and then setting the iframe width to 100%? Please let us know how it goes.

    Cheers,

    Allan

  • Profile Image
    craiggallup
    Answered on October 01, 2011 at 12:20 PM

    Well the quote form is just being a pain, some of the form elements are not showing up properly on mobile. So I just cloned my basic contact form and I will use that set up for mobile with iframe. Using a width of 93% seems to look good on iphone for portrait and landscape.

  • Profile Image
    allanftd
    Answered on October 01, 2011 at 12:54 PM

    Glad that you were able to fix it using the Iframe embed code and it works out adequately for your needs. Please let us know if you need further assistance.

    Thank you and enjoy using JotForm!

    Allan

  • Profile Image
    markashton
    Answered on November 02, 2011 at 06:58 AM

    This problem is not Iframe related.

    Use this form : http://form.jotform.com/form/13002750093

    Try it on a desktop and then an Iphone. The basic generic form field doesn't work properly in a mobile environment.

    I would be interested if anyone could test it on Blackberry and Android and post findings.

    Anyone got an Iframe mobile form working with Jotfom? I spent a couple of days stripping back a form in an iframe on browsers Safari and mobile opera. They simply don't work properly. Fail to load and stuff like that.



  • Profile Image
    aytekin
    Answered on November 02, 2011 at 11:22 AM

    It is happening because of the resize feature of the textarea. I think that feature was added after we tested all features on mobile devices. 

    Here is a screenshot of the problem I took for our developers. 

    We will fix this and get back to you. Thanks! 

  • Profile Image
    emrew86
    Answered on November 03, 2011 at 05:55 AM

    Bug has been fixed...

  • Profile Image
    aytekin
    Answered on November 03, 2011 at 06:03 AM

    Fix confirmed.  

  • Profile Image
    markashton
    Answered on July 03, 2012 at 07:53 AM

    This still doesn't work properly ... The text area thing is unmanageable in terms of size between devices .... ones too thin and one's to fat .....

    Form: http://form.jotformpro.com/form/21843613172954

    See it on a desktop:

     

    See it on an iphone ...

  • Profile Image
    Mike_T
    Answered on July 03, 2012 at 08:32 PM

    Mark,

    You can control the width of your Text Area field by changing the number of its Columns.

    However, it works for desktop browsers only.

    I have created a ticket to see if we can improve Text Area sizing on mobile devices.

  • Profile Image
    liyam
    Answered on July 03, 2012 at 08:37 PM

    Hello Mark.  Or better yet, you can try injecting this CSS code on your form:

    #input_5 { width: 100%;}

    This way, it will always be stretched to a maximum depending on how much width of your form appears on your browser.  Please let us know if it works.

  • Profile Image
    markashton
    Answered on July 04, 2012 at 06:39 AM

    Thanks. Works well if you get it sized on the smartphone and then correct the desktop version with the input css above

    Regards Mark

  • Profile Image
    liyam
    Answered on July 04, 2012 at 09:24 AM

    Thanks for confirming with the details on how you made it work, Mark.

    If you have other questions or concerns, please do let us know.

    Warm regards,

    Liyam