Can i change text box width?

  • Profile Image
    RisingPointSolutions
    Asked 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?

  • Profile Image
    abajan
    Answered 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
    cancjy
    Answered 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
    Ben
    Answered 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.