dir Attributedir Attributedir is a Common Attribute from the
I18N Attribute Collection
and is of Type Enumeration (ltr | rtl).
It may be used on most elements in the Element Index - all except: base, br, param, script. It is #REQUIRED on the bdo element.
The dir attribute is a common Internationalisation attribute
and can be used on most elements.
See also the xml:lang attribute.
bdo elementThe dir attribute is mandatory on the inline bi-directional override element (bdo)
where it is used to specify explicitly whether the script within the bdo element is
to be rendered in a right-to-left ("rtl") or left-to-right ("ltr") fashion, on a character-by-character
basis. This will override the default directionality of the script, as determined by the Unicode
bi-directional algorithm.
For example, for Latin script, which is ordinarily rendered
in a left-to-right direction, the rendering can be forced as right-to-left
by dir="rtl" on an enclosing bdo element:
This renders (in your particular browser) as:
Here is the question "who are you?" rendered backwards: "who are you?"
In the above rendered example, the text which was enclosed within the bdo element should be
presented on the screen as "?uoy era ohw".
This is not a representative example, however: the bdo element
is usually used where a section of script has already been reversed, character-by-character, for presentational reasons
and the natural Unicode ordering of the characters would result in incorrect presentation.
As an alternative to bdo, Unicode has special characters which override the di-directional algorithm.
These should not be used in conjunction with bdo and dir as conflict may occur.
The two examples below are functionally equivalent - user agent support may vary, however.
<bdo dir="ltr">...script to be overridden...</bdo>‭...script to be overridden...‬Similarly, the following two examples are also equivalent:
<bdo dir="rtl">...script to be overridden...</bdo>‮...script to be overridden...‬| Hex. Ref. | Unicode Character Name | Abbreviation |
|---|---|---|
‬ | POP DIRECTIONAL FORMATTING | |
‭ | LEFT-TO-RIGHT OVERRIDE | LRO |
‮ | RIGHT-TO-LEFT OVERRIDE | RLO |
If the dir attribute is used on an element other than
bdo, it specifies the base direction only of directionally neutral
text (i.e. text which has no implicit directionality according to the
Unicode bi-directional algorithm). This is commonly necessary
when embedding a section of right-to-left text within a
left-to-right document or vice versa.
Block-level elements pass on their dir attribute value to
any nested block-level elements; this may be overridden by the
descendant element's own dir attribute.
The base directionality for an entire document may be specified
by setting the dir attribute on the document's html element.
If dir is applied to (or inherited by) a table element, the order
of the columns in the table is also set as right-to-left or left-to-right.
It is not possible to
reverse independently the order of columns within a single row
(using tr) or within a single column group (using colgroup).
The dir attribute can be used on an inline element in order
to achieve correct embedding of inline text. Usually this is not required,
since the bi-directional algorithm takes care of a single level of embedding automatically.
However, if multiple levels of embedding are required, the dir attribute may be used -
see *HTML 4.01 - Setting the direction of embedded text.
As in the case of the bi-directional override above, there are special Unicode characters
which may alternatively be used to achieve this inline bi-directional embedding.
However, again as above, such characters and the dir attribute should not be used together,
to avoid conflict.
The two examples below are functionally equivalent - user agent support may vary, however.
<span dir="ltr">...script to be embedded...</span>‪...script to be embedded...‬Similarly, the following two examples are also equivalent:
<span dir="rtl">...script to be embedded...</span>‫...script to be embedded...‬| Hex. Ref. | Unicode Character Name | Abbreviation |
|---|---|---|
‬ | POP DIRECTIONAL FORMATTING | |
‪ | LEFT-TO-RIGHT EMBEDDING | LRE |
‫ | RIGHT-TO-LEFT EMBEDDING | RLE |
Further reading at the W3C: