Question

提前谢谢，我试图让字体很棒，位于列表中我文本的右侧。我使用的是一种RTL语言，希望有人可以帮忙找不到任何关于此事的内容。

我使用Divi主题

我的文字将与右侧对齐，我希望图标也在右侧

<ul class="fa-ul">
   <li><i class="fa-li fa fa-check-square"></i>List icons</li>
   <li><i class="fa-li fa fa-check-square"></i>List icons</li>
   <li><i class="fa-li fa fa-check-square"></i>List icons</li>

提前感谢，

Answer 1

只需在文字后移动图标......

<ul class="fa-ul">
   <li>List icons<i class="fa-li fa fa-check-square"></i></li>
   <li>List icons<i class="fa-li fa fa-check-square"></i></li>
   <li>List icons<i class="fa-li fa fa-check-square"></i></li>

Answer 2

只需将您的代码更改为此

即可

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<ul class="fa-ul">
  <li>List icons<i class="fa-li fa fa-check-square" style="position:static"></i></li>
  <li>List icons<i class="fa-li fa fa-check-square" style="position:static"></i></li>
  <li>List icons<i class="fa-li fa fa-check-square" style="position:static"></i></li>
</ul>

Answer 3

更改代码只需在文本后移动：

<ul class="fa-ul">
  <li>List icons<i class="fa-li fa fa-check-square" style="position:static"></i></li>
  <li>List icons<i class="fa-li fa fa-check-square" style="position:static"></i></li>
  <li>List icons<i class="fa-li fa fa-check-square" style="position:static"></i></li>
</ul>

Answer 4

您需要将position: initial添加到图标。

这是小提琴：http://jsfiddle.net/JfGVE/2706/

<强> HTML

<ul class="fa-ul">
   <li>List icons<i class="fa-li fa fa-check-square"></i></li>
   <li>List icons<i class="fa-li fa fa-check-square"></i></li>
   <li>List icons<i class="fa-li fa fa-check-square"></i></li>
</ul>

<强> CSS

.fa-ul .fa-li {
  position: initial;
}

将Font Awesome定位为正确列出文本

4 个答案: