Width of phone number field is not displayed correctly.

  • Profile Image
    pamdufour
    Asked on March 06, 2019 at 08:16 PM

    Hello,

    I've tried to no avail to change the input box width on my form as well as the question width. It's not working properly at all! 

    When I change the input width in pixels, my phone number input has the AREA CODE box get really long, but the actual PHONE NUMBER box stays small! Looks ridiculous.

    I also need the questions on my form to be able to be longer - close to full width to fit a detailed question. Found some online answers about CSS which I tried but still doesn't work correctly.

    Please help!

  • Profile Image
    ashwin_d
    Answered on March 07, 2019 at 01:00 AM

    Please inject the following custom css code in form and that should solve your problem:

    [data-type="control_phone"] .form-sub-label-container:first-child [data-component=areaCode] {

        width: 100% !important;

        float: left;

    }

    input[data-component="phone"] {

        width: 100% !important;

    }

    The following guide should help you how to inject custom css code in form:   https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

    Hope this helps.

    Do get back to us if you have any questions.