我有一个简单的 HTML 无序列表
<ul>
<li><a href="#">link1</a> <a href="#">link2</a> text1</li>
<li>text1 <a href="#">link</a></li>
<li>text1 text2</li>
</ul>
如果我的布局方向是从左到右(ltr),最终的内容看起来应该是这样的:
link1 link2 text1text1 link
text1 text2
然而,如果列表项内的内容混合在一起,并且方向设置为从右到左(rtl),那么会出现混乱。 link2 text1 link1
text1 link
text2 text1
这意味着只有包含纯文本的列表元素才能正确地翻转。有什么想法可以解决这个问题吗?
编辑: 看起来内容流程取决于实际内容。这个简单的例子并不能正常工作。
<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>