14

I am working on a Multilanguage website , where in a table one of the td needs to be arabic stuff - which we know need to start from right. I tried it in many ways but couldnt crack it . Would be really appreciated if some one could help me :( .

Here in this text , the content should start from right..

 <TD><div dir="rtl">
  خیز ای عشق مجرد مهر را از سر بگیر<br/>
مردم و خالی شدم ز اقرار و از انکار خود
      </div></TD>
user3030932
  • 161
  • 1
  • 1
  • 5
  • i need css inside a html table for one td block , please help me with that[ url - http://gallery.iis.ac.uk/persian_music/qasida_amadam.html] – user3030932 Nov 25 '13 at 10:33
  • Welcome to Stackoverflow. Please take a moment to check the help section. Please show what you tried – Ahmad Alfy Nov 25 '13 at 10:34
  • hello Ahmad, thanks for your reply , here is the one i tried "

    آمدم تا رو نهم بر خاک پای یار خود
    آمدم تا عذر خواهم ساعتی از کار خود

    " but no luck :(     – user3030932 Nov 25 '13 at 10:40
  • You should include clarifications into the question itself by editing it. A question should be understandable without reading any comments. – Jukka K. Korpela Nov 25 '13 at 10:52
  • Sorry Jukka , I am new to this site registered few minutes ago :) would do that from now on – user3030932 Nov 25 '13 at 10:54
  • The code now included in the question has the desired effect (tested on Chrome, Firefox, IE). If you observe something different, it must be caused by some external code, like CSS settings that override the effect on text alignment. Please try to check this in a simple test document and to construct a smallest possible document that demonstrates the problem. – Jukka K. Korpela Nov 25 '13 at 11:27

5 Answers5

10

The code is:

<html dir="rtl">

Updated answer using CSS:

Try this:

<span style="direction:rtl;">Arabic Text</span>
Praveen Kumar Purushothaman
  • 164,888
  • 24
  • 203
  • 252
6

Both of these are OK:

<style type="text/css">
        body { direction:rtl; }
</style>

or this:

 <body dir="rtl">

or for HTML5: (but this doesn't work always)

 <body dir="auto">
trante
  • 33,518
  • 47
  • 192
  • 272
2

Set the dir=rtl attribute on the td element: <td dir=rtl>...</td>. The HTML attribute should be used instead of the corresponding CSS property, since the basic writing direction is not just a presentational suggestion but something that depends on the content.

You could also set it on an inner element, e.g. <td><div dir=rtl>...</div></td>. But e.g. code like <TD><span dir="rtl"><p>... won’t work, sice the <p> closes the open span element, so the span element has no content and its attributes have no effect.

Added info: Also make sure that no CSS or HTML setting is overriding the desired effect. For example, align=left on the tr element would set the alignment of all cells to left alignment, and the dir=rtl attribute won’t “win” it on its own. (If there is such an attribute and you can’t remove it, set the cell alignment explicitly, using align=right in HTML.)

Jukka K. Korpela
  • 195,524
  • 37
  • 270
  • 390
  • I tried to set the direction inside td element , but it didnt work , the way i am looking out for it to work is , usually a english para starts from left and once we give a
    it starts freshly in new line - the alignment and consistency on both the lines of starting points would be same . When i give this direction rtl - there isnt a consistency , if the second line is longer , it is pushing the right hand side instead of left hand side .     – user3030932 Nov 25 '13 at 11:11
  • Hello Jukka, thanks for holding up with me and explaining , i havent got any luck :( , what i tried to do is create a new test.html .. and removed all the external css which is acting on it .. here is the link to that page - http://gallery.iis.ac.uk/persian_music/test.html – user3030932 Nov 25 '13 at 11:58
  • If you could observe here , the english one's i.e starting from left is absolutely aligned in both the lines of translations , so samething for arabic needs to be repeated from right , but as the first line of lyric is bigger it is pushing the text to right instead of left .Hope you got what i mean – user3030932 Nov 25 '13 at 12:00
  • @user3030932, fine, now the cause of the problem can be seen: it’s the `ALIGN="left"` attribute in the `TR` tag. Removing it should fix the problem. – Jukka K. Korpela Nov 25 '13 at 12:27
  • Jukka have figured it out just a minute ago :) i am now giving aligh="right" along with direction which is working now . Thanks alot for your help – user3030932 Nov 25 '13 at 12:36
1

I suppose you missing alignment option.

HTML dir="rtl" or CSS direction:rtl is to control BiDi for the language script.

But in most cases where mixing different scripts you need to add HTML align="right" or CSS text-align:right which is used to control visual display alignment.

user.dz
  • 962
  • 2
  • 19
  • 39
0

the solution is to put the dir="rtl" (direction:rtl) on the table tag not on td tag. it works fine for me

The Cshe
  • 21
  • 2