Как преобразовать этот код в более читаемый вид?

Question

[symnoob]

Всем привет,

хотелось бы преобразовать этот код в более читаемый вид, возможно ли это?

<th>
  <div style="position: relative"> # <i class="fas fa-sorting-down" style="position:absolute; right:0"></i></div>
</th>

а хотелось бы чтобы эта абра-кадабра выглядела вот так:

<th>
  <div class='sorting-asc'> # </div>
</th>

или ещё круче, вот так:

<th class='sorting-asc'>
  #
</th>

Comments

[Михаил]

чево

[symnoob]

иными словами, можно ли как нибудь придав диву класс отобразить иконку Fontawesome с права?

[FinGanapre]

symnoob, через псевдо элемент, в свойство content которого можно положить код иконки

Answer 1

[FinGanapre]

Если с примерами, то вам нужно сделать так

Как к этому прийти?
Открываем исходники иконочного шрифта ( например 4 версии )
Видим, что все классы с иконками просто задают :before с content: '/код иконки с сайта'
А основной класс задаёт семейство шрифтов.
Комбинируем в вашем классе то и другое - получаем результат.

Comments

[symnoob]

Супер, Спасибо огромное!