Настройка атрибута dir для отдельных элементов списка в Chrome

Question

Я пытаюсь отобразить упорядоченный список HTML, в котором отдельные элементы должны визуализироваться с текстом справа налево и другими слева направо (например, на иврите и английском языке. нет, это не будет выглядеть великолепно.)

Вставлять атрибут на <li> элементов dir="rtl/ltr" дает мне гетерогенную рендеринга в Firefox, но не в Chrome, где он всегда слева направо (example fiddle).

Есть ли способ я могу достичь согласованности кросс-браузера, кроме отказа от элементов списка для <div> с

Answer 1

Это потому, что хром по умолчанию будет установлен text-align: -webkit-match-parent;

Добавить следующее в css решит вашу проблему.

li { 
     text-align: unset; 
    } 

Проверить Fiddle.

Answer 2

Вы должны быть в состоянии использовать следующий CSS (которые работают по желанию.):

li[dir=rtl]{ 
    direction: rtl; 
    unicode-bidi: bidi-override; 
    text-align:right; 
} 

Это даст вам точно the same rendering in FF and chrome