Phone number not showing properly on iPhone - mobile responsive

  • ronprosky
    Asked on February 1, 2017 at 2:00 PM

    phone number field then area code field makes it confusing on iphone 6.

    Jotform Thread 1053739 Screenshot
  • Jan
    Replied on February 1, 2017 at 2:32 PM

    Please try inserting this CSS code in order to reduce the width of the Area field:

    @media screen and (max-width:480px){
    input[name$="[area]"] {width: 80%;}
    }

    Here's a guide on how to inject CSS code in the form:

    1. In the Form Builder V4, click the "Form Designer" icon.

    Phone number not showing properly on iPhone   mobile responsive Image 1 Screenshot 40

    2. Go to the "CSS" tab and paste the custom CSS code. Click the "Save" button after.

    Phone number not showing properly on iPhone   mobile responsive Image 2 Screenshot 51

    Here's the result:

    Phone number not showing properly on iPhone   mobile responsive Image 3 Screenshot 62

    Hope hat helps. Thank you.