I've read through some older similar questions and tried a few of the suggested html-solutions, but nothing worked so far (at least these 3:
<div dir="rtl"></div>; <td dir="rtl"></td>; <html dir="rtl"></html>)
I need to create a table with the left column in English, and the right column in Arabic.
The code I used strangely worked for a bit and on some pages of the Open edX site (FUN MOOC, in case it's relevant), but it's just not working anymore after they've changed the interface afew days ago (so I hope it's just temporary). Furthermore, on the course studio/editor the text is fine, but on the course preview page it's aligned left. This is the code I have:
<table>
<tbody>
<tr>
<td td style="border: none; vertical-align: top; width: 49.25%">
<p align="justify"> </p>
</td>
<td style="border: none; width: 1.5%"> </td>
<td td style="border: none; vertical-align: top; width: 49.25%">
<p align="justify" lang="ar" dir="rtl"></p>
</td>
</tr>
</tbody>
</table>
I have also used this on another page for a few titles, but would like to avoid working with this code (haven't tried checking if this still works after the interface change):
<h2 style="text-align:right">
<span style="float:left">eng text</span>
arabic text
</h2>
My question is: how can this be fixed? What other code could I use? (I don't know CSS well, so solutions in HTML would be amazing).
If you need more details, I can of course provide them to you. Thank you for the help!
Without being able to access the page it's hard to tell what the problem is, but one possibility is that your
dir="rtl"is overridden via CSSdirectionin some way.Try adding
style="direction:rtl;"to your RTL<p>element and see if that fixes it.