在 RTL 中，数字显示在内容 CSS 之前

Question

我正在使用以下内容设计自定义无序列表：

.list-light li a:before {
content: "f104";
font-family: FontAwesome;
margin-left: 8px;
color: #bcc987;
font-size: 12px;
}

如果锚点以字符开头，它就可以正常工作。 但是如果我以一个数字开始，即 200，子弹会移动。

如何解决此问题？ 检查图像

网页代码

<ul class="list-light">
<li><a href="/Portal/ND/515">تنفيذ أولى مراحل التحول الرقمي بمراكز استقبال ضيوف الرحمن بالمدينة المنورة</a></li>
<li><a href="/Portal/ND/514">أمير المدينة المنورة يرأس الاجتماع الأول لمجلس هيئة تطوير المنطقة</a></li>
<li><a href="/Portal/ND/513">خادم الحرمين الشريفين يصل إلى نيوم</a></li>
<li><a href="/Portal/ND/511"> أمير منطقة المدينة المنورة يرأس لجنة الحج بالمدينة المنورة</a></li>
<li><a href="/Portal/ND/510">200 ألف سائح يقلهم باص المدينة السياحي في عامه الأول</a></li>

Answer 1

尝试float:right

.CSS：

.list-light li a:before {
  content: "f104";
  font-family: FontAwesome;
  margin-left: 8px;
  color: #bcc987;
  font-size: 12px;
  float: right;
}
.list-light {
  direction: rtl;
  list-style: none;
}

演示：http://jsfiddle.net/GCu2D/4914/