How to set RTL direction for multilingual form?

  • msafadi
    Asked on January 9, 2019 at 3:38 AM

    hello 

     

    I used my main form language English and I added Arabic as the translated text. I noticed that the labels where right aligned while the rest of the answers were correctly aligned . I used the CSS in this article (https://www.jotform.com/answers/729739-Can-I-Just-change-RTL-in-just-the-arabic-form) to correct this matter but now the labels are correct and the answers are worngly aligned not to mention that all english text in the Arabic in now reversed such as language selelction

     

    here is my form https://www.jotform.com/build/90073090466455

    how can I fix the Arabic to look correct that is lables and the questions inluding the mutliple choice ones right aligned without affecting few English content 

     

    Many Thanks

     

    Jotform Thread 1694374 Screenshot
  • Victoria_K
    Replied on January 9, 2019 at 8:47 AM

    I have tried to pick the code to correct layout of checkbox and radio elements:

    How to set RTL direction for multilingual form? Image 1 Screenshot 20

    Please try the following CSS code: How-to-Inject-Custom-CSS-Codes

    .form-all[dir="rtl"] .form-radio-item:not(#foo) label:before, .form-all[dir="rtl"] .form-radio-item:not(#foo) label:after {

      position: relative;

      float: right;

    }

    .form-all[dir="rtl"] .form-checkbox-item:not(#foo) label:before, .form-all[dir="rtl"] .form-checkbox-item:not(#foo) label:after {

      position: relative;

      float: right;

    }

    .form-all[dir="rtl"] .form-radio-item:not(#foo) label, .form-all[dir="rtl"] .form-checkbox-item:not(#foo) label {

      float: right;

    }

    .form-all[dir="rtl"] .form-radio-item:not(#foo) label:after {

      left: 1.25em;

    }

    .form-all[dir="rtl"] .form-checkbox-item:not(#foo) .form-radio-other, .form-all[dir="rtl"] .form-checkbox-item:not(#foo) .form-checkbox-other {

      position: relative;

      left: 2.35em;

    }

  • Victoria_K
    Replied on January 9, 2019 at 8:48 AM

    Here is the form to test: https://form.jotform.com/90083313806957