How to use jquery steps wizard with right to left steps

Question

I'm using jquery-steps plugin to make a wizard, but the problem is I can not make the steps right to left aligned.

.e.g: my steps: 1.step one 2.step two my expectation: 2.step two 1.step on (also i'm using an rtl language :) )

note: i'm using dynamically jquery step make with (You can check it here)

I tried:

$(document).ready(function() {
  $("#wizard").steps(
    rtl: true
  );
});

but didn't work, how can I solve it? Regards

Have you tried this? https://jsfiddle.net/2quw4hea/ – Sayed Rafeeq Oct 31 '17 at 11:37 — Sayed Rafeeq, Oct 31 '17 at 11:37

score 2 · Answer 1 · answered Oct 05 '19 at 11:25

2

for smart wizard jquery v4.x add this css

.sw-main .sw-container .step-content {
direction: rtl;
text-align: justify;

}

answered Oct 05 '19 at 11:25

keivan kashani

1,263
14
15

score 1 · Accepted Answer · answered Oct 31 '17 at 11:05

1

have you tried this : ?

.wizard>.steps>ul>li, .wizard>.actions>ul>li {
    float: right;
}

answered Oct 31 '17 at 11:05

Rahele Dadmand

573
1
4
17

Tried it, was not enough for me. – Benyamin Shoham Jun 06 '18 at 13:39
can you share your code ? maybe thats a different case @BenyaminShoham – Rahele Dadmand Jun 09 '18 at 11:35

score 0 · Answer 3 · answered Jun 06 '18 at 13:41

This is my CSS for switching jQuery.steps right to left:

body {
    direction: rtl;
}

.wizard>.steps>ul>li, .wizard>.actions>ul>li {
    float: right;
}

.wizard > .content > .body {
    direction: rtl;
}
.wizard > .content > .body p {
    text-align: right;
}

How to use jquery steps wizard with right to left steps

3 Answers3