How to make text field bigger/higher

  • Tim Clay
    Asked on April 2, 2024 at 4:48 AM
  • Frédéric JotForm Support
    Replied on April 2, 2024 at 5:55 AM

    Hi Tim,

    Thanks for reaching out to Jotform Support. To make the text field bigger fir the Configurable List widget, you might want to inject teh following CSS code:

    .configurable-list-field-label {
      font-size: 24px;
    }

    #listContainer .form-dropdown, #listContainer .form-textarea, #listContainer .form-textbox:not(#productSearch-input) {
        font-size: 18px;
    }
    .translatable form-textbox .time-input {
        font-size: 18px;
    }


    The first part being for the field names, the other parts for the field content filled by the form filler, depending on their type: text, dropdown menu, date, and time.

    Let me show you how to do it. 

    1. In Form Builder, select the Configurable List widget and select its wander icon.
    2. In the right panel, select the Custom CSS tab, and paste the CSS code above into the area dedicated, and you're done.How to make text field bigger/higher Image 1 Screenshot 30

    As a result, we get:

    How to make text field bigger/higher Image 2 Screenshot 41

    Give it a try and let us know how it goes. 

 
Your Answer