gwydion93
gwydion93

Reputation: 1923

Font Awesome class "fa-check" is not displaying check mark

I have a simple html page using font awesome css. Can anyone see why my font awesome check mark is not displaying, I cannot get the check mark to display and I cannot seem to figure out why. font awesome check error

I am using the .min.css link in my <Head> as such:

<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>LoopLAB Theme</title>
  <link rel="stylesheet" href="css/font-awesome.min.css">
  <link rel="stylesheet" href="css/bootstrap.css">
  <link rel="stylesheet" href="css/style.css">
</head>

When I want to inject it into a <i> element in the DOM, I simply use this:

<i class="fa fa-check"></i>

As you can see above, the check mark does not display. Do you see anything obvious that I am doing wrong? This seems like a beginner's error but I can't find the problem.

Upvotes: 0

Views: 2814

Answers (1)

Vitor Figueredo
Vitor Figueredo

Reputation: 629

Check your CSS. There are a few ways you can do that!

  1. Simply check if font-awesome.min.css is indeed under your CSS folder. If it is, check your folder structure. Can your HTML access this folder using css/font-awesome.min.css? The CSS folder must be a child from the folder you are currently storing your HTML file. Finally, are you using the latest version of font-awesome-min.css? This specific icon might not be included in your CSS file if it's an older version.
  2. Inspect your site using your favorite browser inspect tool and locate your CSS file on inside the inspector. Clicking on it should open your CSS code. The code should be minified. If there is nothing inside of it or some kind of error your website is failing to find your file on your server or computer.

Plus you can also add from a CDN, for example, https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css and import directly to your code.

Upvotes: 1

Related Questions