css code to right to left, not realy working

  • Profile Image
    hammerto
    Asked on November 08, 2017 at 04:10 AM

    Hi I am trying to build an Right to left form and having some real trouble with it.

    I typed the CCS code; the problem is that the Header of the question when he is set to top is appearing on the Left side and not on the right side as it supposed to be.

    .form-all {

     

    text-align: right;

     

    direction: rtl !important;

     

    unicode-bidi: bidi-override !important;

     

    }

     

    .form-line-column,

     

    .form-label-top,

    text-align: direction right

     

    .form-radio-item {

     

    float:right;

     

    }



    Tnx


     

  • Profile Image
    Jim_R
    Answered on November 08, 2017 at 04:39 AM

    Please change your Custom CSS Codes. Remove everything and replace them with the following:

    .form-sub-label {

      direction: rtl;

      unicode-bidi: bidi-override;

    }

    .form-all {

      direction: rtl;

    }

    .form-line-column, .form-label.form-label-auto, .form-radio-item {

      float: right !important;

      text-align: right !important;

    }

    Related guide: How-to-Inject-Custom-CSS-Codes 

  • Profile Image
    hammerto
    Answered on November 08, 2017 at 04:57 AM

    Thanks for your quick answer,

    It changed it on the editor, but on the form itself it shows the header on the right side

    https://form.jotform.com/73111500695954 

  • Profile Image
    Jim_R
    Answered on November 08, 2017 at 05:44 AM

    Sorry but I'm kinda confused with your last reply. Your aim is to orient your form from right to left, correct? And your field label appears to be in the far right at the moment.

    Isn't that how it's supposed to render with a right to left orientation? If that's not how you want it to display, can you be more specific where you want the label to be positioned?

  • Profile Image
    hammerto
    Answered on November 08, 2017 at 05:51 AM

    Yes you are confused: please refer to the TOP on the right side

    I typed the CCS code; the problem is that the Header of the question when he is set to top is appearing on the Left side and not on the right side as it supposed to be.

  • Profile Image
    ashwin_d
    Answered on November 08, 2017 at 08:43 AM

    Have you solved this problem already?

    I did check your form with its direct URL, and the question label is being displayed correctly as right aligned. Please check the screenshot below:

    1510148516labelAlign.png

    Please test your form again and get back to us if the issue persists.

  • Profile Image
    hammerto
    Answered on November 09, 2017 at 04:17 AM

    Hi Thanks for your answer,

    Yes the header is right but the * (star for required field is on the wrong side) and text in English is in a disorder. Family Name

     

    Do you have a solution for that?

    BR


    Tommy

  • Profile Image
    ashwin_d
    Answered on November 09, 2017 at 06:41 AM

    That is because you still have few labels configured as left and few as right. Please inject the following custom css code in your form and see if that solves your problem:

    .form-label-right {

        float: right !important;

        text-align: right !important;

        width: 26px;

    }

    .form-label-left {

        float: right;

        text-align: right;

        width: 20px;

    }

    The following guide should help you how to inject custom css code in form:  https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

    Do get back to us if you need any other changes.

  • Profile Image
    hammerto
    Answered on November 12, 2017 at 05:29 AM

    THNX, I am still struggling with the form but I will open another TAG in another Issue