Hyphen between area code and phone number is not in the right place

Hyphen between area code and phone number is not in the right place. See attached. Is there a solution for this?

Is this the form that's shown on your screenshot?

https://www.jotform.com/72357174363257

I'm seeing you already figured out how to hide the separator using CSS.

In case we're mistaken and you need further help, just get back to us so we can assist you.

Te back end data will be without the hyphen between area code and phone number.

What if I want the hyphen? What's the solution?

The back end data will not be affected by the style changes you made in your form. The CSS codes injected to your form works in the form level only.

Anyway, if you want the hyphen to be visible, here's how:

1. Remove the following CSS codes injected to your form.

.phone-separate {

 display: none;

}

2. Then add this:

input[name*="[area]"] {

    width: 90%;

}

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

    width: 42%;

    margin-right: 0;

}

Result:

Hope this helps!

OK, thank you. Good to have the options.