HTML list content direction in rtl

Question

I have a simple HTML unordered list

<ul>
    <li><a href="#">link1</a> <a href="#">link2</a> text1</li>
    <li>text1 <a href="#">link</a></li>
    <li>text1 text2</li>
</ul>

If I have normaln ltr layout, final content looks like this

link1 link2 text1
text1 link
text1 text2

However, if the content inside a list item is mixed, and direction is set to rtl, I get a complete mess

link2 text1 link1
text1 link
text2 text1

which means only the list element containing text only gets reversed properly. Any ideas on how to get this working correctly?

edit: It seems that the content flow depends on the actual content. A simple example like this doesn't work

<ul dir="rtl">
  <li>
    <a href="#">12:30 - 13:30</a>
    some text
    <a href="#">link text</a>
  </li>
</ul>
<ul dir="ltr">
  <li>
    <a href="#">12:30 - 13:30</a>
    some text
    <a href="#">link text</a>
  </li>
</ul>

Answer 1

you could this Html/CSS styling for Arabic Language

"<ol style="list-style-type:arabic-indic ;direction:RTL; text-align: right"><li>مرحبا بك و اهلا و سهلا </li></ol>"

Answer 2

It works out of the box

The attribute dir="RTL"

using your markup only position the content at the right side

  <div dir="RTL">
    <ul>
      <li><a href="#">My Web Home Site</a> <a href="#">My Other Web Site</a> My First Text</li>
      <li>My First Text <a href="#">My First Link</a></li>
      <li>My First Text, My Second text</li>
    </ul>
  </div>
  
  <hr/>
  
  <div dir="LTR">
    <ul>
      <li><a href="#">My Web Home Site</a> <a href="#">My Other Web Site</a> My First Text</li>
      <li>My First Text <a href="#">My First Link</a></li>
      <li>My First Text, My Second text</li>
    </ul>
  </div>
  

It's all a matter of how you write your content, more information here