How to place two fields on same line?

  • CelesteInTex
    Asked on May 26, 2016 at 6:48 PM

    There are two fields in my form that I want to be on the same line : Phone Number and Email Address

    I can get them on the same line by using Shrink but that actually shrinks the field itself rather than adjusting the dead real estate to the right of the field.

    The Phone Number field is now severely shortened. Ideally I would like to get the Email field lined up under the last name field.

    http://www.trustingyouareloved.com/sandbox/contact/

    Thanks for helping me get this straightened out!

  • Kiran Support Team Lead
    Replied on May 26, 2016 at 9:56 PM

    I see that the Phone number and Email address are already placed in a single line on your JotForm. You may be interested in taking a look at our guide Field-Positioning for placing multiple fields in a single row.

    In order to increase the width of the phone number field, please inject the following CSS code to your JotForm:

    #input_22_full.mask-phone-number {

        width : 310px !important;

    }

    The phone field should be displaying as shown below after injecting the CSS code.

    How to place two fields on same line? Image 1 Screenshot 20

    Hope this information helps! If you need any further assistance, please let us know. We will be happy to help. 

  • CelesteInTex
    Replied on May 26, 2016 at 10:07 PM

    THANK YOU!

    That is perfect, much appreciated!