Как применить атрибут direction css в элементах списка

Question

У меня есть устаревшая HTML-разметка, и мне нужно включить поддержку арабского языка.

Итак, у меня есть список заголовков новостей и они отображаются в <li> элементах.

Вот соде:

..
<li>
<a>some Arabic text</a>
<em>news datetime</em>
</li>
..

Итак, мне нужно применить выравнивание текста и направление rtl для привязки, но не для даты и времени. Я применил выравнивание текста для элемента <li>, и все в порядке. Но мне нужно применить стиль «direction: rtl» для привязки, и здесь моя проблема.

Я попытался создать элемент <div> с атрибутом направления rtl и поместить в него привязку. Это прекрасно работает в Chrome, но мне нужно поддерживать IE6 +

Также я попытался применить атрибут направления к <li> и переопределить этот атрибут в <em>, но это не работает.

Есть предложения?

Спасибо заранее, Виталий.

Answer 1

li {direction:rtl}
em {direction:ltr; float:left}

Answer 2

если em вне li

<ul dir="rtl">
     <li>العربية</li>
     <em>11/24/2011</em>
     <li>العربية</li>
     <em>11/24/2011</em>
     <li>العربية</li>
     <em>11/24/2011</em>
     <li>العربية</li>
     <em>11/24/2011</em>
</ul>

если вам нужен em внутри div

<style>
ul { direction:rtl; } ul li em{direction:ltr;} /* em{direction:ltr; float:left;} */
</style>

---

<ul>
         <li>العربية
         <em>11/24/2011</em>
         </li>
         <li>العربية
         <em>11/24/2011</em>
         </li>
         <li>العربية
         <em>11/24/2011</em>
         </li>
</ul>

если ваш арабский алфавит содержит английские слова

<style>
    ul { direction:rtl; } ul li{ direction:rtl; } ul li em{direction:ltr;} /* em{direction:ltr; float:left;} */
</style>