Unicode-bidi - CSS-Tricks | CSS Almanac 2025

A unicode-bidipropriedade é uma das duas propriedades CSS que controlam a renderização de texto bidirecional em HTML e linguagens baseadas em marcação semelhantes (por exemplo, XML). A outra propriedade é direction, e as duas são usadas juntas para criar níveis de texto incorporado com diferentes direções de texto (da direita para a esquerda e da esquerda para a direita) em um único elemento DOM.

.bilingual-excerpt ( direction: rtl; unicode-bidi: embed; )

O navegador geralmente determina em qual direção o texto embutido fluirá, dependendo do langatributo dos elementos, da localidade do navegador e font-familyde elementos específicos. unicode-bidié útil quando um elemento contém texto LTR e texto RTL:

O agente do usuário aplica um algoritmo complexo definido pelo padrão Unicode para determinar como o texto deve aparecer. Esta propriedade controla especificamente os níveis de incorporação e substituições para o algoritmo bidirecional Unicode.

A unicode-bidipropriedade tem três valores amplamente suportados:

a palavra-chave “normal”, que não oferece níveis adicionais de texto bidirecional incorporado (o comportamento padrão do navegador). Um elemento com esta propriedade conterá apenas texto LTR ou RTL.
a palavra-chave “embed”, que permite texto bidirecional em um elemento (por exemplo, texto RTL fluindo em meio ao texto LTR). Isso é determinado pela directionpropriedade e deve ser aplicado a um elemento embutido.
a palavra-chave “bidi-override”, que age da mesma forma que “embed” quando aplicada a elementos embutidos. Em elementos de nível de bloco, ele substitui o algoritmo de texto bidirecional do navegador e flui o texto dentro de qualquer filho inline estritamente de acordo com a directionpropriedade.

Pontos de interesse

A unicode-bidipropriedade é “destinada a designers DTD. Web designers e autores semelhantes não devem substituí-lo. ” Decida com cuidado se você precisa usá-lo.
Embora o Internet Explorer suporte tecnicamente unicode-bididesde a versão 5.5, existem “bugs graves relacionados a elementos flutuantes” e o uso é confiável no IE 8+ (veja abaixo)