1

I am using Font Awesome Free 5.5.0 and define icon in css, like this. 

.nav-side-menu li :not(collapsed) .arrow:before {
    content: "\f007";
    font-family: "Font Awesome 5 Free";
    display: inline-block;
    padding-left: 10px;
    padding-right: 10px;
    vertical-align: middle;
    float: right;
}

it works fine, but just for few icons. I need to use this one, with code "f107". But this code doesn´t work. I can find this code even in my linked font-awesom file in project, with same class name as in documentation, but when i use it in css, nothing happend.

kores59
  • 443
  • 1
  • 5
  • 16

2 Answers2

1

use this css will work fine. we have to set font weight to define the solid icon.

.nav-side-menu li :not(collapsed) .arrow:before {
    content: "\f007";
    font-family: "Font Awesome 5 Free";
    display: inline-block;
    padding-left: 10px;
    padding-right: 10px;
    vertical-align: middle;
    float: right;
    font-weight: 900;
}
Sumit Patel
  • 4,530
  • 1
  • 10
  • 28
-1

You don't need define an icon specially in your CSS file.
If you have loaded font-awesome, it should be already available.
Have you tried <i class="fas fa-angle-down" />?

Demo here fiddle

baartko
  • 97
  • 1
  • 1
  • 5