How Can I remover/set the area code to have character spaces?

hi there,

 

I am almost there with the form setup the only annoying thing I can see is the area code in the phone number has just no space to view what the user enters - it just shows an icon there - I haven't messed around with any of the settings - what I would like is to have some character spacing there if that is not possible just remove it so the form is usable - any quick advice would be most welcome as I want to subscribe your service and the directors will want to see the form in good working condition. Why does this phone field have this icon on the right side as u activate the field - it just limits what the user can see

Any help advice would be most welcome.

 

 

Jay

That looks like an auto-fill feature from the browser, but since the field is too small it took all the space.

I wasn't able to replicate this issue on my side, but you could resolve that by adding the below CSS code to your Custom CSS field:

#input_14_area{

width:40px;

}

#input_17_area { width: 40px; }

It will increase the area code field so your users will be able to input data. And it will do it for both area code fields.

If you have any further questions please let us know.

Thank you!

Also, I forgot to mention that you can increase the above numbers to fit your needs, I put 40px, and it looks like this: https://form.jotformpro.com/71733329395968

Thank you!

 

Many thanks will try that I am using the Safari Browser on Sierra Operating system on the Mac - perhaps in future this setting could be done for Safari as there will be many people who use Macs to fill out the forms - Many thanks for your courteous reply and TY !!!
Kind Regards,
Jayesh Parmar.
IT Support
Official site: http://www.corereview.co.uk
Web App: http://www.londoncorereviewapp.com
...

I think that I looking better any chance of making that rectangle wider so you can put 4 or more digits for area code for example in the uk we use area codes like 0208
Kind Regards,
Jayesh Parmar.
IT Support
Official site: http://www.corereview.co.uk
Web App: http://www.londoncorereviewapp.com
...

You can make the area code field wider by increasing the number in CSS I provided above.

So please use this CSS:

#input_14_area{

width: 60px;

}

#input_17_area { 

  width: 60px;   

}

It will fit four numbers.

If that is what you had in mind?

Thank you!

That is excellent NIK !!!! Ty so SO MUCH
My final request is to increase the PHONE NUMBER FIELD to 12 characters
I hope by me asking for these requests, the responsive layout of the form won’t be jeopardised
...

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

#input_14_phone{

    width: 105% !important;

}