How can I change name and email box size without affecting other text boxes?

  • julianl
    Asked on May 6, 2015 at 8:34 PM

    Hi How are we all today?

    I have an order form that only requires small input fields, but I need to keep the name and e-mail address the same size. How can I independently change the text input box sizes while keeping the name and e-mail boxes the same size?

    I have been trying to inject css but there is something I am doing wrong :(

    The link below is a work in progress. Thanks for any help!

  • Boris
    Replied on May 6, 2015 at 10:22 PM

    Hello Julian.

    You can add the following custom CSS to your form:

    #cid_3, #input_3, #cid_16 { max-width: 300px !important; }

    It will make the name and email input fields 300px wide. Please take a look at this guide on how to add custom CSS to your form:

    How to Inject Custom CSS Codes

    You can see the selectors that are used by looking at the field properties:

    How can I change name and email box size without affecting other text boxes? Image 1 Screenshot 30

    Your form should end up looking like this:

    How can I change name and email box size without affecting other text boxes? Image 2 Screenshot 41

    Please let us know how it goes, or if we can help you with anything else.

    Kind regards,
    Boris

  • julianl
    Replied on May 6, 2015 at 10:25 PM

    Thanks Boris,

    Will give it a go :)

  • Chriistian Jotform Support
    Replied on May 6, 2015 at 10:52 PM

    On behalf of my colleague, you are welcome. Please do let us know if you need more information. Thanks.