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;
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 thebidi-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 definition
Initial value | normal
|
Applies to | all elements, though some values have no effect on non-inline elements |
Inherited | no |
Computed value | as specified |
Animation type | discrete |
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
Specifications
Specification | Status | Comment |
---|---|---|
CSS Writing Modes Module Level 3The definition of 'unicode-bidi' in that specification. | Proposed 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 compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
unicode-bidi
|
Chrome
Full support 2 |
Edge
Full support 12 |
Firefox
Full support 1 |
IE
Full support 5.5 |
Opera
Full support 9.2 |
Safari
Full support 1.3 |
WebView Android
Full support 1 |
Chrome Android
Full support 18 |
Firefox Android
Full support 4 |
Opera Android
Full support 10.1 |
Safari iOS
Full support 3.1 |
Samsung Internet Android
Full support 1.0 |
isolate
|
Chrome Full support 48 Full support 48 Full support 16 Prefixed' Implemented with the vendor prefix: -webkit-
Notes' Avoiding using |
Edge Full support 79 Full support 79 Full support 79 Prefixed' Implemented with the vendor prefix: -webkit- |
Firefox Full support 50 Full support 50 No support 10 — 54 Prefixed' Implemented with the vendor prefix: -moz-
Notes' From Firefox 10 to Firefox 16 (inclusive), the |
IE
No support No |
Opera Full support 35 Full support 35 Full support 15 Prefixed' Implemented with the vendor prefix: -webkit-
Notes' Avoiding using |
Safari Full support 6 Full support 6 Prefixed' Implemented with the vendor prefix: -webkit-
Notes' Avoiding using |
WebView Android
Full support 48 |
Chrome Android
Full support 48 |
Firefox Android Full support 50 Full support 50 No support 10 — 54 Prefixed' Implemented with the vendor prefix: -moz-
Notes' From Firefox 10 to Firefox 16 (inclusive), the |
Opera Android
Full support 35 |
Safari iOS Full support 6 Full support 6 Prefixed' Implemented with the vendor prefix: -webkit-
Notes' Avoiding using |
Samsung Internet Android
Full support 5.0 |
isolate-override
|
Chrome
Full support 48 |
Edge
Full support 79 |
Firefox Full support 50 Full support 50 No support 17 — 54 Prefixed' Implemented with the vendor prefix: -moz- |
IE
No support No |
Opera
Full support 35 |
Safari
No support No |
WebView Android
Full support 48 |
Chrome Android
Full support 48 |
Firefox Android Full support 50 Full support 50 No support 17 — 54 Prefixed' Implemented with the vendor prefix: -moz- |
Opera Android
Full support 35 |
Safari iOS
No support No |
Samsung Internet Android
Full support 5.0 |
plaintext
|
Chrome
Full support 48 |
Edge
Full support 79 |
Firefox Full support 50 Full support 50 No support 10 — 54 Prefixed' Implemented with the vendor prefix: -moz-
Notes' Before Firefox 50, the |
IE
No support No |
Opera
Full support 35 |
Safari
No support No |
WebView Android
Full support 48 |
Chrome Android
Full support 48 |
Firefox Android Full support 50 Full support 50 No support 10 — 54 Prefixed' Implemented with the vendor prefix: -moz-
Notes' Before Firefox 50, the |
Opera Android
Full support 35 |
Safari iOS
No support No |
Samsung Internet Android
Full support 5.0 |
Legend
- Full support
- Full support
- No support
- No support
- See implementation notes.'
- See implementation notes.
- Requires a vendor prefix or different name for use.'
- Requires a vendor prefix or different name for use.
See also
unicode-bidi by Mozilla Contributors is licensed under CC-BY-SA 2.5.