What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Can i change text box width?

    Asked by RisingPointSolutions on January 05, 2012 at 08:48 AM

    Making the label larger or expanding the label doesn't change the text box size. Can you advis how I can make them wider?

    size label
  • Profile Image
    JotForm Support

    Answered by abajan on January 05, 2012 at 10:35 AM

    To change the width of a text box, click it and in the toolbar click the Size button, change the value to suit your requirements and save the form:


    Alternatively, CSS can be injected to accomplish the same task, with the added benefit of less variation in width across browsers. The following rule will display all of the text boxes in a form 200 pixels wide:

    .form-textbox {
    width: 200px;
    }

    However, applying that width to only certain text boxes in the form would require more specificity. For instance, the following rule is used in the form pictured below to change the width of just the first and third text boxes:

    #id_1 .form-textbox,
    #id_4 .form-textbox {
    width: 200px;
    }

    (Click image to view live form - and clone it, if you like)

    Text areas are not affected by .form-textbox. Their class is .form-textarea and the following rule was used in the same form to shrink the default width of the second text area to 300 pixels:

    #id_6 .form-textarea {
    width: 300px;
    }

    Like text boxes, text areas have a tool in the form builder to adjust their width:

    text area columns


    Many modern browsers allow users to adjust the dimensions of text areas and as such, the information provided above only affects the initial width of a text area (when the page loads). 

    Firebug comes in handy when trying to determine the ID assigned to each element by the JotForm system. To find out more about how CSS works, check out MaxDesign.com.

  • Profile Image

    Answered by cancjy on April 25, 2016 at 04:39 AM

    Even when I change the size as mentioned above, the text box remains the same
  • Profile Image

    Answered by Ben on April 25, 2016 at 07:20 AM

    @cancjy

    I have moved your post to a new thread here: https://www.jotform.com/answers/825659 where we will be assisting you shortly.