HI,
I seem to be having trouble with linking Font Awesome into my own HTML file on my personal computer. I am trying to link font awesome using the CDN method linked in the exercise linked in the title of this post (as i would prefer not to use a local source of font awesome) but all i am getting when i try to get an icon is a outline of a box instead of the actual icon.
Am i missing something? Can anyone help?
Hi! To make help possible share your HTML and CSS, please
ok heres my code:
…head>
link rel=“stylesheet” href=“https://cdn.jsdelivr.net/npm/@fortawesome/[email protected]/css/fontawesome.min.css”>
/head>
body>
i class=“fa fa-check”>
(i have removed the first backwards arrow so the code appears as i have forgotten how else to make it appear in this message)
After including this in the text all i get is an empty box instead of the icon.
This variant is useless, can you post your HTML and CSS code properly using backticks?
Or use the button “Preformatted text” in the editor (</>)
<head>
<title>Website under development</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/[email protected]/css/fontawesome.min.css" integrity="sha384-BY+fdrpOd3gfeRvTSMT+VUZmA728cfF9Z2G42xpaRkUGu2i3DyzpTURDo5A6CaLK" crossorigin="anonymous">
<link href="resources/styles.css" rel="stylesheet">
</head>
<body>
<header class="header-main">
<div class="header-main-logo">
<img src="resources/images/bling.jpeg" alt="logo bling thing">
<nav class="header-main-nav">
<ul>
<li><a href="index.html">HOME</a></li>
<i class="fa fa-check"></i>
<li><a href="pages/Perfume.html">PERFUME</a></li>
<li><a href="#">ACCESSORIES</a></li>
<li><a href="#">JEWELLERY</a></li>
<li><a href="#">WEIRD & WONDERFUL</a></li>
<li><a href="#">KIDS ITEMS</a></li>
<li><a href="#">SEASONAL</a></li>
</ul>
</nav>
</div>
Thats all my html code and i havent made any css code in relation to this icon. is that ok now?Yes, thank you! Seems like the issue was in inappropriate link setup.
To link Font Awesome use this script line (for example):
<script src="https://kit.fontawesome.com/529402571f.js" crossorigin="anonymous"></script>
Something like this?
ok thanks but should oi just copy and paste this code for each time i want to link in font awesome or is there more to it?
Of course you shouldn’t, kits and packs have their unique IDs. Also the are another ways to add icons to your project, choose what is most suitable for you. You can learn more here:
https://docs.fontawesome.com/web/add-icons/how-to
This topic was automatically closed 41 days after the last reply. New replies are no longer allowed.
