How to align prefix, first, middle, and last name in a single row

  • Profile Image
    Gayav
    Asked on September 01, 2016 at 09:22 AM
    #2.Please email me the css code to align prefix,First,Middle ,Last name need to be aligned in a single row,If you can reduce the prefix text box size smaller is fine.
  • Profile Image
    Boris
    Answered on September 01, 2016 at 09:35 AM

    The reason that the individual fields from your Full Name field are displaying in two rows is due to existing CSS from the design of your form. In order to counter it, we would need to utilize the following CSS:

    #cid_12 { max-width: none; }
    #cid_12 > .form-sub-label-container { width: 24%; margin-right: 1%; }

    You can add the above CSS codes either by opening up the Designer, or by following this guide:

    https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    You would also need to remove this part of your existing custom CSS:

    [data-type="control_fullname"] .form-sub-label-container:first-child {
        margin-right : 0 !important;
    }

    Making these changes would cause your full name field appear like this: