Menu
I meet problem that fontawesome Icon does not show up on Chrome. ( Safari and Moz both works fine ). Does anyone have a clew why this happened. Thanks All.
Here is the Snapshot:
I know that the default font path that fontawesome.min.css directs ../font/......, but I have changed path name to " ../fonts/ " for my project, still doesn't work. The icon never shows up.
688
Using any other won't work. For instance, if you try showing <i class="fas fa-user"></i> on Font Awesome 4, it won't get displayed. Note: Font Awesome allows you to add icons using ONLY <i> and <span> tags. If you use any other element they won't show. Only add your classes to either of the two.
On the top of the CSS file you should see the Font Awesome version as in the screenshot below: Now that you know which version your website is using, you can go ahead and use only those icons that are supported by your Font Awesome version. Below are the links to libraries of all the Font Awesome icons for each version from v3 to 6.
Chrome displaying font problem - Google Chrome Community. 1. Launch Chrome. 2. Go to settings. 3. Go to Advanced Settings. 4. Turn off use hardware acceleration when available. 5. Relaunch Chrome.
Versions conflict Font awesome, since its initial release in 2012 to this date has been undergoing a set of updates and changes, which have been affecting how it works in one way or another. For instance, before the release of version 5, all Font Awesome classes had the first class as " fa " then followed with a second class, " fa-icon-name ".
Check if you have your Adblocker disabled. Sometimes chrome extensions can prevent the browser from showing the icons.
51
Is bootstrap working? It looks like your Css directory is capitalized which would cause your reference to the css file to not work.
Try replacing
./css/font-awesome.min.css
with
./Css/font-awesome.min.css
As mentioned in the comment on your original question, you could try using the CDN momentarily to see if the icon appears. If the icon does appear using the CDN, you know you have an issue with your path like I have mentioned above.
Here is the html code you would use for the CDN (version 3.2.1):
<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
Aside from this, you are also using an outdated version of font-awesome. If possible in your circumstance, I recommend upgrading to the latest version. You can find more information on the latest version by visiting the following link.
http://fontawesome.io/get-started/
If you are going to use the latest version, make sure to look at examples as they have changed the way you write the html code.
Edit after updating Font-awesome:
If you are going to use the latest version of font-awesome, you need to change the HTML code to
<i class="fa fa-times" aria-hidden="true"></i>
CDN for the latest version (4.7):
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
I had a similar issue, and I resolved it with these steps:
font-awesome.min.css filewebfonts, which is the default parent folder name of the fonts. If you found a bunch, then replace each of them with the name of your fonts folder in your project. ...This way, the font references inside your ..min.css points to the correct directory path where your fonts are :)
I found out this out by opening chrome dev tools in incognito mode, and looking at the console errors.
32
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
