Enlarge comments box to fit the width of the mobile screen

  • Profile Image
    plott
    Asked on June 30, 2015 at 07:52 AM

    At the end of my form, I have a comments box.  When I design it, it appears to be the right size.  However, when I bring it up on the iPhone, it is not the width I would expect.  I assume this is because I'm using columns in my form for alignment (maybe not).  Is there anyway to get my comment field to expand the width of the screen?

  • Profile Image
    Kiran
    Answered on June 30, 2015 at 11:24 AM

    Could you try adding the Mobile Responsive widget to your JotForm to see if that helps in making the comment field to fit the width of the screen? As I tested on an iPhone simulator it seems to be working fine with the widget.

    Hope this information helps. Let us know if you need any further assistance. We will be happy to help.

  • Profile Image
    plott
    Answered on June 30, 2015 at 12:18 PM
    OK, I tried this.
    When I did, it messed up my prior fields. That is everything then showed up on a line by itself.
    Is there anyway to turn the 'columns' off prior to my comments text area?
    Peter Ott

    ...
  • Profile Image
    Kiran
    Answered on June 30, 2015 at 01:43 PM

    I see that the Form Responsive option is enabled on both from the Form Preferences and Form Designer which should be fine to view the form on a mobile. Is the form embedded on any your webpage? If so, could you provide us with the webpage URL where the form is embedded so that we can take a look at it?

    If you want to turn off the columns, you may uncheck the Enable form columns option from the Form Layout section in the Form Designer. 

    Also, I notice that the Label for the Comments field is aligned to left. Please see if that helps when it is set to Auto align.

    Thanks!

  • Profile Image
    plott
    Answered on June 30, 2015 at 02:18 PM
    Thank you. I tried changing the alignment of the label - no difference.
    I don't want to turn the columns off globally as the reason I set this in the first place was to align my other fields.
    This is not embedded in a webpage, it's going to be used via smartphone.
    It looks fine during design, but when rendering on the iPhone (5), the box only spans about half of the screen.
    Peter Ott

    ...
  • Profile Image
    Kiran
    Answered on June 30, 2015 at 03:31 PM

    It seems that the issue is existing with iphone 5 only. As I check your JotForm on iPhone 5s and 6 simulators, it seems to be working fine. Please see the screenshots below :

    iPhone 5

    iPhone 5s

    iPhone 6

     

    Please try adding the CSS code below to your JotForm by following the guide How-to-Inject-Custom-CSS-Codes :

    @media only screen 

    and (min-device-width : 320px) 

    and (max-device-width : 568px) 

    and (orientation : portrait) { 

    #input_28 {

    width : 80% !important;

    }

    #input_28-limit {

    margin-right: 15%;

    }

    }

    As I tested it using the cloned version of your JotForm and on iphone 5 simulator, the result is as in the screenshot below :

    Hope this information helps. Please get back to us if you need any further assistance. We will be happy to help.

    Thanks!!