Having Problem after changing my form RTL

After I solved my problem at making arabic form and I got the support to change my form RTL but now evertime I write in English I got a problem the characters not equal Like This 

I Wrote "Ahmed" in the example and look how it look like at the form please help 

And this is the code that the support gives to use RTL Form 

.form-all {

font-family: "Lucida Grande", sans-serif;

}

.form-all {

width: 650px;

}

.form-label-left,

.form-label-right {

width: 150px;

}

.form-label {

white-space: normal;

}

.form-label.form-label-auto {

display: inline-block;

float: left;

text-align: right;

width: 150px;

}

.form-label-left {

display: inline-block;

white-space: normal;

float: left;

text-align: left;

}

.form-label-right {

display: inline-block;

white-space: normal;

float: left;

text-align: right;

}

.form-label-top {

white-space: normal;

display: block;

float: none;

text-align: left;

}

.form-all {

font-size: 14px;

}

.form-label {

font-weight: bold;

}

.form-checkbox-item label,

.form-radio-item label {

font-weight: normal;

}

.supernova {

background-color: #ffffff;

}

.supernova body {

background-color: transparent;

}

/*

@width30: (unit(@formWidth, px) + 60px);

@width60: (unit(@formWidth, px)+ 120px);

@width90: (unit(@formWidth, px)+ 180px);

*/

/* | */

@media screen and (min-width: 480px) {

.supernova .form-all {

border: 1px solid #e6e6e6;

-webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.1);

-moz-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.1);

box-shadow: 0 3px 9px rgba(0, 0, 0, 0.1);

}

}

/* | */

/* | */

@media screen and (max-width: 480px) {

.jotform-form {

padding: 10px 0;

}

}

/* | */

/* | */

@media screen and (min-width: 480px) and (max-width: 768px) {

.jotform-form {

padding: 30px 0;

}

}

/* | */

/* | */

@media screen and (min-width: 480px) and (max-width: 649px) {

.jotform-form {

padding: 30px 0;

}

}

/* | */

/* | */

@media screen and (min-width: 768px) {

.jotform-form {

padding: 60px 0;

}

}

/* | */

/* | */

@media screen and (max-width: 649px) {

.jotform-form {

padding: 0;

}

}

/* | */

.supernova .form-all,

.form-all {

background-color: #ffffff;

border: 1px solid transparent;

}

.form-header-group {

border-color: #e6e6e6;

}

.form-matrix-table tr {

border-color: #e6e6e6;

}

.form-matrix-table tr:nth-child(2n) {

background-color: #f2f2f2;

}

.form-all {

color: #555555;

}

.form-header-group .form-header {

color: #555555;

}

.form-header-group .form-subHeader {

color: #6f6f6f;

}

.form-sub-label {

color: #6f6f6f;

}

.form-label-top,

.form-label-left,

.form-label-right,

.form-html {

color: #555555;

}

.form-checkbox-item label,

.form-radio-item label {

color: #6f6f6f;

}

.form-line.form-line-active {

-webkit-transition-property: all;

-moz-transition-property: all;

-ms-transition-property: all;

-o-transition-property: all;

transition-property: all;

-webkit-transition-duration: 0.3s;

-moz-transition-duration: 0.3s;

-ms-transition-duration: 0.3s;

-o-transition-duration: 0.3s;

transition-duration: 0.3s;

-webkit-transition-timing-function: ease;

-moz-transition-timing-function: ease;

-ms-transition-timing-function: ease;

-o-transition-timing-function: ease;

transition-timing-function: ease;

background-color: #ffffe0;

}

/* ömer */

.form-radio-item,

.form-checkbox-item {

padding-bottom: 0px !important;

}

.form-radio-item:last-child,

.form-checkbox-item:last-child {

padding-bottom: 0;

}

/* ömer */

.form-single-column .form-checkbox-item,

.form-single-column .form-radio-item {

width: 100%;

}

.supernova {

height: 100%;

background-repeat: no-repeat;

background-attachment: scroll;

background-position: center top;

background-repeat: repeat;

}

.supernova {

background-image: none;

}

#stage {

background-image: none;

}

/* | */

.form-all {

background-repeat: no-repeat;

background-attachment: scroll;

background-position: center top;

background-repeat: repeat;

}

.form-header-group {

background-repeat: no-repeat;

background-attachment: scroll;

background-position: center top;

}

.form-line {

margin-top: 14px;

margin-bottom: 14px;

}

.form-line {

padding: 12px 36px;

}

.form-all .form-textbox,

.form-all .form-radio-other-input,

.form-all .form-checkbox-other-input,

.form-all .form-captcha input,

.form-all .form-spinner input,

.form-all .form-pagebreak-back,

.form-all .form-pagebreak-next,

.form-all .qq-upload-button,

.form-all .form-error-message {

-webkit-border-radius: 6px;

-moz-border-radius: 6px;

border-radius: 6px;

}

.form-all .form-sub-label {

margin-left: 3px;

}

.form-all .form-textarea {

-webkit-border-radius: 6px;

-moz-border-radius: 6px;

border-radius: 6px;

}

.form-all {

-webkit-border-radius: 20px;

-moz-border-radius: 20px;

border-radius: 20px;

}

.form-section:first-child {

-webkit-border-radius: 20px 20px 0 0;

-moz-border-radius: 20px 20px 0 0;

border-radius: 20px 20px 0 0;

}

.form-section:last-child {

-webkit-border-radius: 0 0 20px 20px;

-moz-border-radius: 0 0 20px 20px;

border-radius: 0 0 20px 20px;

}

.form-all .qq-upload-button,

.form-all .form-submit-button,

.form-all .form-submit-reset,

.form-all .form-submit-print {

font-size: 1em;

padding: 9px 15px;

font-family: "Lucida Grande", sans-serif;

font-size: 14px;

font-weight: normal;

}

.form-all .form-pagebreak-back,

.form-all .form-pagebreak-next {

font-size: 1em;

padding: 9px 15px;

font-family: "Lucida Grande", sans-serif;

font-size: 14px;

font-weight: normal;

}

/*

& when ( @buttonFontType = google ) {

@import (css) "@{buttonFontLink}";

}

*/

h2.form-header {

line-height: 1.618em;

font-size: 1.714em;

}

h2 ~ .form-subHeader {

line-height: 1.5em;

font-size: 1.071em;

}

.form-header-group {

text-align: left;

}

/*.form-dropdown,

.form-radio-item,

.form-checkbox-item,

.form-radio-other-input,

.form-checkbox-other-input,*/

.form-captcha input,

.form-spinner input,

.form-error-message {

padding: 4px 3px 2px 3px;

}

.form-header-group {

font-family: "Lucida Grande", sans-serif;

}

.form-section {

padding: 0px 0px 0px 0px;

}

.form-header-group {

margin: 12px 36px 12px 36px;

}

.form-header-group {

padding: 24px 0px 24px 0px;

}

.form-textbox,

.form-textarea {

padding: 4px 3px 2px 3px;

}

.form-textbox,

.form-textarea,

.form-radio-other-input,

.form-checkbox-other-input,

.form-captcha input,

.form-spinner input {

background-color: #ffffff;

}

[data-type="control_dropdown"] .form-input,

[data-type="control_dropdown"] .form-input-wide {

width: 150px;

}

.form-label {

font-family: "Lucida Grande", sans-serif;

}

li[data-type="control_image"] div {

text-align: left;

}

li[data-type="control_image"] img {

border: none;

border-width: 0px !important;

border-style: solid !important;

border-color: false !important;

}

.form-line-column {

width: auto;

}

.form-line-error {

overflow: hidden;

-webkit-transition-property: none;

-moz-transition-property: none;

-ms-transition-property: none;

-o-transition-property: none;

transition-property: none;

-webkit-transition-duration: 0.3s;

-moz-transition-duration: 0.3s;

-ms-transition-duration: 0.3s;

-o-transition-duration: 0.3s;

transition-duration: 0.3s;

-webkit-transition-timing-function: ease;

-moz-transition-timing-function: ease;

-ms-transition-timing-function: ease;

-o-transition-timing-function: ease;

transition-timing-function: ease;

background-color: #fff4f4;

}

.form-line-error .form-error-message {

background-color: #ff3200;

clear: both;

float: none;

}

.form-line-error .form-error-message .form-error-arrow {

border-bottom-color: #ff3200;

}

.form-line-error input:not(#coupon-input),

.form-line-error textarea,

.form-line-error .form-validation-error {

border: 1px solid #ff3200;

-webkit-box-shadow: 0 0 3px #ff3200;

-moz-box-shadow: 0 0 3px #ff3200;

box-shadow: 0 0 3px #ff3200;

}

.ie-8 .form-all {

margin-top: auto;

margin-top: initial;

}

.ie-8 .form-all:before {

display: none;

}

/* | */

@media screen and (max-width: 480px), screen and (max-device-width: 768px) and (orientation: portrait), screen and (max-device-width: 415px) and (orientation: landscape) {

.jotform-form {

padding: 0;

}

.form-all {

border: 0;

width: 100%;

max-width: initial;

}

.form-sub-label-container {

width: 100%;

margin: 0;

}

.form-input {

width: 100%;

}

.form-label {

width: 100%!important;

}

.form-line {

padding: 2% 5%;

-moz-box-sizing: border-box;

-webkit-box-sizing: border-box;

box-sizing: border-box;

}

input[type=text],

input[type=email],

input[type=tel],

textarea {

width: 100%;

-moz-box-sizing: border-box;

-webkit-box-sizing: border-box;

box-sizing: border-box;

max-width: initial !important;

}

.form-input,

.form-input-wide,

.form-textarea,

.form-textbox,

.form-dropdown {

max-width: initial !important;

}

div.form-header-group {

padding: 24px 0px !important;

margin: 0 12px 2% !important;

margin-left: 5% !important;

margin-right: 5% !important;

-moz-box-sizing: border-box;

-webkit-box-sizing: border-box;

box-sizing: border-box;

}

[data-type="control_button"] {

margin-bottom: 0 !important;

}

.form-buttons-wrapper {

margin: 0!important;

}

.form-buttons-wrapper button {

width: 100%;

}

table {

width: 100%!important;

max-width: initial !important;

}

table td + td {

padding-left: 3%;

}

.form-checkbox-item input,

.form-radio-item input {

width: auto;

}

.form-collapse-table {

margin: 0 5%;

}

}

/* | *//*__INSPECT_SEPERATOR__*/

.form-all * {

text-align : right;

direction : rtl !important;

unicode-bidi : bidi-override !important;

}label.form-label-top, label.form-label-left, label.form-label-right {

font-weight : bold;

margin-bottom : 9px;

float : right;

text-align : right;

}

I checked your jotform http://www.jotform.com/53542035889564 and I see what you meant.

Actually, this is how it really work.

Since your form is in Arabic language, it is expected that the input will be in Arabic language as well - not English.

If you want the form to be multilingual, create first the form in English, and then add the Language Tool to have an Arabic version of the form.

user guide: How-to-make-your-forms-multilingual

Take note that you can set the default language othern than English after you have added the other language (i.e Arabic)

Here is a demo form you can check https://form.jotform.com/60165836672966

 

Let us know if you need further assistance.

 

 

 

 

 

 

This is actually a big in your system fix it as soon as passable even when I write numbers happens the same thing  

Hi,

 

As my colleague said, the input must be in arabic language when filling up a form in Arabic Language. For now, you can try my colleague's suggestion as a workaround for your concern.

 

Do inform us if you need further assistance,
Regards.