CSS unicode-bidi Property

The unicode-bidi property specifies the behavior of the bidirectional text in a document.

The unicode-bidi property allows to override the Unicode algorithm and control the text embedding. The unicode-bidi property should not be overridden by users, authors, and web designers. It should commonly be used by DTD designers.

This property works only with the direction property.

The unicode-bidi and the direction properties are the only properties that are not affected by all property.

Initial Value	normal
Applies to	All elements, though some values have no effect on non-inline elements.
Inherited	Yes.
Animatable	No.
Version	CSS2
DOM Syntax	object.style.unicodeBidi = "isolate";

Syntax

unicode-bidi: normal | embed | bidi-override | isolate | isolate-override | plaintext | initial | inherit;

Example of the unicode-bidi property:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      div.text {
        direction: rtl;
        unicode-bidi: embed;
      }
    </style>
  </head>
  <body>
    <h2>Unicode-bidi property example</h2>
    <div>Normal writing direction.</div>
    <div class="text">Using "embed" value.</div>
  </body>
</html>

Try it Yourself »

Example of the unicode-bidi property with the "bidi-override" value:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      div.text {
        direction: rtl;
        unicode-bidi: bidi-override;
      }
    </style>
  </head>
  <body>
    <h2>Unicode-bidi property example</h2>
    <div>Normal writing direction.</div>
    <div class="text">Using "bidi-override" value.</div>
  </body>
</html>

Try it Yourself »

Values

Value	Description	Play it
normal	Does not suggest an additional level of embedding.	Play it »
embed	Opens an additional level of embedding in case the element is inline.	Play it »
bidi-override	Creates an override for an inline element. For block container elements this value creates an override for inline-level descendants.	Play it »
isolate	The element is isolated from its siblings. This value specifies that the element’s container directionality should be calculated without considering the content of this element.
isolate-override	Applies the isolation behavior to the surrounding content and the override behavior to the inner content.
plaintext	This value behaves as isolate value but the directionality is calculated using the P2 and P3 rules of the Unicode Bidirectional Algorithm.
initial	Sets the property to its default value.	Play it »
inherit	Inherits the property from its parent element.