W3cubDocs

/CSS

unicode-bidi

The unicode-bidi CSS property, together with the direction property, determines how bidirectional text in a document is handled. For example, if a block of content contains both left-to-right and right-to-left text, the user-agent uses a complex Unicode algorithm to decide how to display the text. The unicode-bidi property overrides this algorithm and allows the developer to control the text embedding.

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

Note: This property is intended for Document Type Definition (DTD) designers. Web designers and similar authors should not override it.

/* Keyword values */
unicode-bidi: normal;
unicode-bidi: embed;
unicode-bidi: isolate;
unicode-bidi: bidi-override;
unicode-bidi: isolate-override;
unicode-bidi: plaintext;
/* Global values */
unicode-bidi: inherit;
unicode-bidi: initial;
unicode-bidi: unset;
Initial value normal
Applies to all elements, though some values have no effect on non-inline elements
Inherited no
Media visual
Computed value as specified
Animation type discrete
Canonical order the unique non-ambiguous order defined by the formal grammar

Syntax

Values

normal
The element does not offer an additional level of embedding with respect to the bidirectional algorithm. For inline elements, implicit reordering works across element boundaries.
embed
If the element is inline, this value opens an additional level of embedding with respect to the bidirectional algorithm. The direction of this embedding level is given by the direction property.
bidi-override
For inline elements this creates an override. For block container elements this creates an override for inline-level descendants not within another block container element. This means that inside the element, reordering is strictly in sequence according to the direction property; the implicit part of the bidirectional algorithm is ignored.
isolate
This keyword indicates that the element's container directionality should be calculated without considering the content of this element. The element is therefore isolated from its siblings. When applying its bidirectional-resolution algorithm, its container element treats it as one or several U+FFFC Object Replacement Character, i.e. like an image.
isolate-override
This keyword applies the isolation behavior of the isolate keyword to the surrounding content and the override behavior of the bidi-override keyword to the inner content.
plaintext
This keyword makes the elements directionality calculated without considering its parent bidirectional state or the value of the direction property. The directionality is calculated using the P2 and P3 rules of the Unicode Bidirectional Algorithm.
This value allows the display of data that is already formatted using a tool following the Unicode Bidirectional Algorithm.

Formal syntax

normal | embed | isolate | bidi-override | isolate-override | plaintext

Examples

CSS

.bible-quote {
  direction: rtl; 
  unicode-bidi: embed; 
}

HTML

<div class="bible-quote">
  A line of text
</div>
<div>
  Another line of text
</div>

Result

Specification

Specification Status Comment
CSS Writing Modes Module Level 3
The definition of 'unicode-bidi' in that specification.
Candidate Recommendation Added plaintext, isolate, and isolate-override keywords.
CSS Level 2 (Revision 1)
The definition of 'unicode-bidi' in that specification.
Recommendation Initial definition.

Browser compatibilityUpdate compatibility data on GitHub

Desktop
Chrome Edge Firefox Internet Explorer Opera Safari
Basic support 2 12 1 5.5 9.2 1.3
isolate 48
48
16
Prefixed
Prefixed Requires the vendor prefix: -webkit-
Avoiding using -webkit-isolate. It can lock up older versions of Safari (up to version 9) and Chrome (up to version 47).
Since Chrome 19, the syntax from a previous version of the specification, where the isolate keyword could be used together with bidi-override, is allowed.
No 50
50
10 — 54
Prefixed
Prefixed Requires the vendor prefix: -moz-
From Firefox 10 to Firefox 16 (inclusive), the isolate keyword could be used together with bidi-override, which was the syntax from a previous version of the specification. From Firefox 17, only one value is allowed. Use isolate-override instead the previous isolate bidi-override.
No No Yes
Prefixed
Yes
Prefixed
Prefixed Requires the vendor prefix: -webkit-
Avoiding using -webkit-isolate. It can lock up older versions of Safari (up to version 9) and Chrome (up to version 47).
plaintext 48 No 50
50
10 — 54
Prefixed
Prefixed Requires the vendor prefix: -moz-
Before Firefox 50, the plaintext value was ignored for vertical writing modes (bug 1302734).
Before Firefox 15, plaintext didn't do anything to an inline element. The specification changed and the implementation was changed in Firefox 15.
No No No
isolate-override 48 No 50
50
17 — 54
Prefixed
Prefixed Requires the vendor prefix: -moz-
No No No
Mobile
Android webview Chrome for Android Edge Mobile Firefox for Android Opera for Android iOS Safari Samsung Internet
Basic support 1 Yes Yes 4 8 3.1 Yes
isolate 48 48 No 50
50
10 — 54
Prefixed
Prefixed Requires the vendor prefix: -moz-
From Firefox 10 to Firefox 16 (inclusive), the isolate keyword could be used together with bidi-override, which was the syntax from a previous version of the specification. From Firefox 17, only one value is allowed. Use isolate-override instead the previous isolate bidi-override.
No No 5.0
plaintext 48 48 No 50
50
10 — 54
Prefixed
Prefixed Requires the vendor prefix: -moz-
Before Firefox 50, the plaintext value was ignored for vertical writing modes (bug 1302734).
Before Firefox 15, plaintext didn't do anything to an inline element. The specification changed and the implementation was changed in Firefox 15.
No No 5.0
isolate-override 48 48 No 50
50
17 — 54
Prefixed
Prefixed Requires the vendor prefix: -moz-
No No 5.0

See also

© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/unicode-bidi