CSS - direction



The direction property sets the direction of the text, table columns, and horizontal overflow.

Possible Values

  • ltr − Text and other elements will be rendered from left to right. It is the default value.

  • rtl − Text and other elements will be rendered from right to left. It is used for languages that have right-to-left scripts.

For the direction property to have any effect on inline-level elements, the unicode-bidi property's value must be embed or override.

Applies to

All the HTML elements.

DOM Syntax

object.style.direction = "ltr";

CSS direction - ltr Value

Following example demonstrates direction:ltr:

<html>
<body>
   <h2>CSS direction - ltr Value</h2>
   <p style = "direction:ltr;">
      Text-direction - Left-to-right
   </p>
</body>
</html> 

CSS direction - rtl Value

Following example demonstrates direction:rtl:

<html>
<body>
   <h2>CSS direction - rtl Value</h2>
   <p style = "direction:rtl;">
      Text direction - Right-to-left
   </p>
</body>
</html> 
Advertisements