HTML Dir Attribute

Definition

The dir Attribute specifies the direction of the element’s text.

Applicable Elements

dir is a Global Attribute, meaning it can be used with all HTML Elements.

HTML Global dir Attribute

The dir global attribute specifies the direction of the element’s text.

Syntax

<p dir="ltr">This text appears left to right.</p>
<p dir="rtl">This text appears right to left.</p>
<p dir="auto">The browser determines the direction.</p>
<p dir="auto">المتصفح يحدد الاتجاه.</p>

Usage

• The dir attribute causes any text within the element to be explicitly directionally isolated.
• The dir attribute can take the values ltr, rtl, or auto. See the Values section below for more details.
• This attribute is mandatory for the <bdo> element.
• This attribute does not influence the directionality of any child <bdi> elements.
• This attribute can be overridden by the direction and unicode-bidi CSS properties. It is recommended to use the dir attribute instead of CSS as it confers semantic meaning.
• The auto value should only be used where the text direction is unknown, such as text derived from user input.
• The directionality of an element is relatively complex. The HTML Living Standard Specification sets out a complex order of steps to determine the directionality of any element.

Values

Values can include:

• ltr - This will display the text content within the element from left to right. This is useful for displaying languages such as English where the surrounding content may be written from right to left, such as on an Arabic website.
• rtl - This will display the text content within the element from right to left. This is useful when displaying languages that should be written as such, for example, Arabic.
• auto - This value lets the user agent or browser decide the correct directionality. It uses a basic algorithm to process the characters inside the element. When the user agent finds a character with a strong directionality, such as Arabic, that directionality is applied to the whole element.
  Warning

  The auto state is very crude in that it only looks at the first character of the text that carries strong directionality. The HTML specification recommends only using this value as a last resort.

Specification

The dir HTML specification is as follows:

• HTML Living Standard Specification

Browser Support

The dir has the following browser support:

Desktop

Mobile