CSS direction (Define Text Direction)

The CSS direction property is used to define the direction of text. For example:

HTML with CSS Code
<!DOCTYPE html>
<html>
<head>
   <style>
      .a{direction: ltr;}
      .b{direction: rtl;}
   </style>
</head>
<body>

   <div class="a">
      <h2>direction: ltr</h2>
   </div>
   
   <div class="b">
      <h2>direction: rtl</h2>
   </div>
   
</body>
</html>
Output

direction: ltr

direction: rtl

CSS direction Syntax

The syntax of direction property in CSS, is:

direction: x;

The value of x should be any of the following:

  • ltr - used to define the text direction from left to right. This is the default value
  • rtl - used to define the text direction from right to left
  • initial - used to use the default value
  • inherit - used to use the value inherited by the parent element

CSS Online Test


« Previous Tutorial Next Tutorial »