6

The html attribute dir and the css text-align property acheive the same result. E.g. consider the two cases:

  1. dir="rtl" 

<p dir="rtl">
  one two.
</p>
  1. text-align: right

<p style="text-align: right;">
  one two.
</p>

The only difference between these two results is the placement of dot. Why isn't <p dir="rtl"> one two. </p> translated to .owt eno? If it can't then what is the use of dir attribute at all?

unor
  • 92,415
  • 26
  • 211
  • 360
user31782
  • 7,087
  • 14
  • 68
  • 143
  • 1
    https://www.w3.org/International/questions/qa-html-dir – Quentin Oct 20 '16 at 14:28
  • 1
    @Quentin But even if I do not use `dir` attribute on Arabic or Urdu language it is still written from right to left? So is direction totally decided by the browser? Do browsers override `dir`'s value? – user31782 Oct 20 '16 at 14:33
  • E.g. both of the following give same output. One. `

    سلسلة نصية الذهاب

    ` Two: `

    سلسلة نصية الذهاب

    `     – user31782 Oct 20 '16 at 14:36
  • Seems like `bdo` element is capable of overriding browser's implantation. So do we have to always use `bdo` and `dir` in combination? – user31782 Oct 20 '16 at 14:45
  • 1
    @Quentin Hello Quentin, you have marked my question as duplicate. The linked question is talking about the css property `direction` not `dir` attribute. – user31782 Oct 20 '16 at 15:16

1 Answers1

3

The placement of the dot is the crucial point of the difference between dir and text-align. Handling right to left scripts is much more involved than handling the alignment of the text. To understand better, read

https://www.w3.org/International/articles/inline-bidi-markup/uba-basics

A sequence of rtl characters such as سلسلة نصية الذهاب works automatically because of the Unicode bidirectional algorithm relying on the character's directional properties, but you need more to properly handle punctuation, images, and bidirectional text.

bdi is an element, not an attribute name.

don't get bdi confused with bdo. The former applies heuristics to guess the direction of text, the latter overrides the bidirectional algorithm (and is very rarely used).

For a more complete picture about how to work with RTL (or actually bidirectional) text in html, see

https://www.w3.org/International/tutorials/bidi-xhtml/index

r12a
  • 61
  • 3
  • 0 down vote (btw, one additional thing, looking at the examples above, be careful about leaving spaces before the closing markup - see https://www.w3.org/International/questions/qa-bidi-space) – r12a Oct 21 '16 at 13:07