HTML dir Attribute Tutorial

In this section, we will learn what the dir attribute is and how to use it in HTML.

HTML dir Attribute Definition and Usage

The `dir` attribute stands for direction and is used to set the direction of the content of an element.

By default, text content of an element like <p> is set to “ltr” which means content should be displayed from left-to-right direction.

But, with the help of dir attribute, we can change this default behavior to “rtl” which means content should be displayed from right to left instead.

HTML dir Attribute Syntax

<element dir = “ltr | rtl | auto”>

HTML dir Attribute Values

There are three values that could be used for the dir attribute:

  • “ltr”: this is the default value, and it stands for Left to Right. That means the content should be displayed from left-to-right direction.
  • “rtl”: this value stands for Right to Left and we use it to display content from Right-to-Left direction.
  • auto: using this value, we mean browsers should decide automatically on what direction the content should be displayed.

Example: dir ltr and dir rtl

See the Pen dir ltr and dir rtl by Omid Dehghan (@odchan1) on CodePen.

Leave a Reply