CSS :dir()

The :dir() pseudo-class selects elements based on their resolved text direction. It does not set direction; it matches elements whose direction is ltr or rtl.

Syntax

selector:dir(ltr) { }
selector:dir(rtl) { }

Example

p:dir(rtl) {
  border-inline-start: 0.25rem solid #2563eb;
  padding-inline-start: 0.75rem;
}

Result:

Text with right-to-left direction.

Important note

To set direction, use the HTML dir attribute or the CSS direction property. Use :dir() only to select based on that direction.