CSS color Property

CSS direction property specifies the direction of text, table columns, and horizontal overflow.

CSS direction property to affect reordering in inline elements, only if unicode-bidi property value must be embed or override.


The following table outline the usages and version history of this property.

Default value: ltr
Applies to: All elements
Inherited: Yes
Version: CSS2
JavaScript Syntax: object.style.direction = "rtl"


Here is a syntax for the CSS direction property

direction: ltr | rtl | initial | inherit;

Property Values

The following table describes the values of this property.

Value Description
ltr Default. Sets a left-to-right direction
rtl Sets a left-to-right direction
initial Sets default value of this property
inherit Inherits this property from its parent element


The example below shows to sets text colors.

.direction1 {
  direction: ltr;
  unicode-bidi: bidi-override;
.direction2 {
  direction: rtl;
  unicode-bidi: bidi-override;

Run it...   »

Browser Compatibility

  • Google Chrome 2+
  • Mozilla Firefox 1+
  • Internet Explorer 5.5+
  • Opera 9.2+
  • Safari 1.3+

Note: Here details of browser compatibility with version number may be this is bug and not supported. But recommended to always use latest Web browser.