How do I increase text area width?

  • Profile Image
    motoxplorers
    Asked on February 25, 2015 at 01:56 PM

    Hi guys,

     

    I need to adjust the size of 2 text areas in my form http://form.jotformeu.com/form/50542643100340

    Basically I need to increase them to width around 250 or 300px so they can fill one line of my form beautifully ;)

    Can you help me please.

     

    Thanks

  • Profile Image
    Sean
    Answered on February 25, 2015 at 04:09 PM

    Please inject this code into your form:

    .form-textarea {
    width: 250px;
    }

    You can adjust the width by increasing or decreasing 250px.

    You can reference this guide for the steps to inject the CSS code:
    http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 


    Thanks

  • Profile Image
    motoxplorers
    Answered on February 26, 2015 at 03:47 PM

    Hi Sean

    thank you for your help, i follow your instructions but I'm a very limited code injector and it did not worked. ;)

    Can you please clone my form and try to make the Special Needs textarea the same size as the Sub Label and the Comments text area to hav the same width as the to above textboxes together (Passenger and nationality textboxes)? 

    Thanks

  • Profile Image
    Ben
    Answered on February 26, 2015 at 05:40 PM

    I would be glad to make the change, but I can not find the Passenger and nationality textboxes to base the width to.

    However, if you use this CSS code:

    li[data-type="control_textarea"] textarea {
        min-width: 200px;
    }

    You can change the width of the both textarea without any difficulties by adjusting the width in the CSS code.

    To add it, please follow the steps here, but add the code at the bottom / end of all other codes and it should work properly for you.

  • Profile Image
    motoxplorers
    Answered on February 27, 2015 at 06:03 AM

    thanks Ben, that worked to one of the textarea boxes but I do not know how to adjust the width of the second one...

    As you can see in the screenshot I need the text areas with the same size as their own sub labels, so they can be aligned with the above boxes. 

    I just write the xvxvxvxvxvxvxvxv... sub label in Comments textarea so you can se the width I need on that box.

    I know it is a small detail but it's the difference between Ok and perfect ;) 

    Can you help me?

    You can see it on this form http://form.jotformeu.com/form/50573033565352 you can clone and adjust

     

    Thanks mates

  • Profile Image
    Ben
    Answered on February 27, 2015 at 09:22 AM

    I know what you mean and we would be glad to help you set it to perfect :)

    There was no sub-label yesterday for the second one, but I see one for both now and this is the code to get them to that size:

    #id_90 textarea {
        min-width: 183px;
        resize: vertical;
    }
    #id_91 textarea {
        min-width: 330px;
        resize: vertical;
    }

    The first one is for the left textarea and the one under it (#id91) is for the right one.

    I also included the code to show that it can only be resized by the height, not by the width ;)

    Do let us know how it goes and remember to copy the code at the bottom of the Form Styles area.