I Can't Get My Font-Awesome Icons to Show Up. Tried Importing CSS with Multiple Methods

ul a {  text-decoration:none;  font-size:25px;}

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css"><ul class="special">  <li><i class="fas fa-pencil" title="Edit"></i></li>  <li><a href="#" class="fas fa-search"><span class="label">Magnifier</span></a></li>  <li><a href="#" class="fas fa-tablet"><span class="label">Tablet</span></a></li>  <li><a href="#" class="fas fa-flask"><span class="label">Flask</span></a></li>  <li><a href="#" class="fas fa-cog"><span class="label">Cog?</span></a></li></ul>

Font Awesome icons are not working, I have included all required files

Under your reference, you have this:

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">

Specifically, the href= part.

However, under your full html is this:

<link src="http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">

Have you tried replacing src= with href= in your full html to become this?

<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">

Works for me: http://codepen.io/TheNathanG/pen/xbyFg

1 of 3 font awesome icon not showing up on page

The problem with the third one is that fad icons (look at fad class that you've added in the third one) is a pro icon that is a paid service. You have to own a Pro fontawesome account to be able to use it.by changing <i class="fad fa-chart-pie-alt"></i> to <i class="fas fa-chart-pie"></i> the third one will work but the icon is a little bit different.

One fontawesome icon is rendering while the other isn't?

Don't add the class on the a tag. Add font-awesome classes inside a <i> tag, like given below:

<li><a href="#"><i class="fas fa-envelope"></i> <span class="label">Email</span></a></li>
<li><a href="#"><i class="fas fa-graduation-cap"></i><span class="label">Google Scholar</span></a></li>

Codepen: https://codepen.io/manaskhandelwal1/pen/NWROWmZ

---

If you don't have the latest version you can either download this file or use directly also inside the link tag: https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css

---

To get the latest versions classes, visit the official documentation here and just search the icon there and click on it to find all details about it: https://fontawesome.com/icons?d=gallery

---

Related Topics