Question 282845 in Html Question posted in
Some basic documentation can be found here.

Inserting icon from fontawesome into html fails

Even though I gave the link:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">

into the html file but when embedding the

<p class="icon"><i class="fa-solid fa-magnifying-glass-minus"></i></p>

tag to insert the icon does not work, sometimes Some other icons like "fa fa-envelope" are fine. I don’t understand why, please help me. Thank you very much.

Tags:

2

Answers


  1. 0

    Here you can see that icon isn’t available for FA5 https://fontawesome.com/v5/search?q=magnifying.

    But it is on FontAwesome 6 => https://fontawesome.com/icons/magnifying-glass-minus?f=classic&s=solid

    Here I just changed the version of the FA asset loaded from a cdn:

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css" integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA==" crossorigin="anonymous" referrerpolicy="no-referrer" />

<i class="fa-solid fa-magnifying-glass-minus">
    Login or Signup to reply.
  2. 0

    This icon is not exist in font-awesome 5 version.
    Try to use font-awesome 6.4 version instead of 5.15.

    If your site is large try to use an image for magnifying-glass-minus instead of icon. It’ll help you. And will not disturbed remaining icons.

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css" integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA==" crossorigin="anonymous" referrerpolicy="no-referrer" />

<i class="fa-solid fa-magnifying-glass-minus">
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search