dir (HTML attribute)

Spec
Depr. Version
No HTML 4
Browser support (more…)
IE5.5+ FF1+ SA3+ OP9.2+
Full Full Full Full

Syntax

dir=" { ltr | rtl } "

Description

The dir attribute tells the browser the direction in which the displayed text is intended to be read. The browser will render text from left to right by default, but as with the lang attribute, you’ll need to override the intended reading direction if you’re including text that runs in the opposite direction (for example, Arabic or Hebrew).

If the bulk of your document is written in English, but it features excerpts in Hebrew, the default rendering will be left to right. However, the Hebrew phrases will need to be marked up as reading right to left, or "rtl". If the page were written primarily in Hebrew, then the reverse is true—the direction should be set on the body or html element as "rtl", with discrete phrases in English marked up using "ltr".

Using the dir attribute doesn’t actually reverse the order of the text contained within the element to which the attribute is applied (for that, you’d need to use the bidirectional override element, or bdo); it does, however, swap the alignment of text contained in block-level elements so that each new line of text starts at the right of the screen, leaving a ragged left-hand edge.

Note that the dir attribute is also used to define the reading order of text or data contained in tables.

Also, note that the dir attribute cannot be applied to the following elements:

  • applet
  • base
  • basefont
  • bdo
  • br
  • frame
  • frameset
  • iframe
  • param
  • script

Example

The following example indicates that the direction of the Hebrew text is right to left:

<p>The bulk of the content is in English and flows left to right,
until this phrase in Hebrew makes an appearance,
<span lang="he" dir="rtl"> שָׁלוֹם</span> (meaning hello), which
needs to be set to read right-to-left.</p>

Value

"ltr" and "rtl" are the only values this attribute can take.

Compatibility

Internet Explorer Firefox Safari Opera
5.5 6.0 7.0 1.0 1.5 2.0 1.3 2.0 3.0 9.2 9.5
Full Full Full Full Full Full Partial Partial Full Full Full

Browser support for dir is generally good, although Safari 2 and earlier versions don’t honor the changed direction of "rtl" when applied to the bdo element as they should, although they do right-align the text in block elements marked as being "rtl".

User-contributed notes

There are no comments yet.

Related Products