Question posted in
The full documentation can be found here.

Divi theme – Make Font Awesome positioned right to list text

thanks in advance,
I’m trying to make font awesome to be positioned to the right of my text in a list. I’m using A RTL language hope someone could help couldn’t find nothing regarding this.

I’m using Divi theme

my text will be aligned to the right and I want the icon to be in the right as well

<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>

thanks in advance,

Tags:

4

Answers


  1. 0

    Simply move icon after text…

    <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>
    Login or Signup to reply.
  2. 0

    Simply change your code to this

    <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>
    Login or Signup to reply.
  3. 0

    Change code just move after text:

    <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>
    Login or Signup to reply.
  4. 0

    You need to add position: initial to icon.

    Here is fiddle : 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;
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search