I need to change the font-family to some DropDownList I have, icons are visible until I change the font-family. Every font-family I choose doesn't work for the icon, and so I always see a square instead, how can I fix it?
Thanks
This is a Pro icon! To use the solid style of “square“, you'll need a subscription to a Pro-level plan or a perpetual Pro license that includes the specific version of Font Awesome in which this icon (or style) was released.
Make sure you're using the latest and greatest by updating your CDN code reference, updating your Font Awesome package via npm, or downloading a fresh copy of Font Awesome. You can check with version an icon was added to on its detail page (e.g. question-circle was added in Verion 1 but last updated in 5.0. 0).
You can place Font Awesome icons just about anywhere using the CSS Prefix fa and the icon's name. Font Awesome is designed to be used with inline elements (we like the <i> tag for brevity, but using a <span> is more semantically correct). icon If you change the font-size of the icon's container, the icon gets bigger.
fas: font awesome solid. It is also free to use. fab: font awesome brands. Free to use.
For
<i>
tags, put priority to use FontAwesome font-family
body * {
font-family:'tahoma'!important;
}
body i {
font-family:'FontAwesome'!important;
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<span class="fa fa-male"></span> <span>Male</span>
<br>
<span class="fa fa-female"></span> <span>Female</span>
<hr>
<i class="fa fa-male"></i> <span>Male</span>
<br>
<i class="fa fa-female"></i> <span>Female</span>
<head>
tag, like this <link rel="stylesheet" href="https://opensource.keycdn.com/fontawesome/4.7.0/font-awesome.min.css" integrity="sha384-dNpIIXE8U05kAbPhy3G1cz+yZmTzA6CY8Vg/u2L9xRnHjJiAK76m2BIEaSEV+/aU" crossorigin="anonymous">
<i class="fa fa-address-book" aria-hidden="true"></i>
, no more, no less, nothing in between, don't change <i>
to <span>
or change it's font-family
. If you want to update colours, stylings, I recommend to add new class to it and update this way.It could also be which link you are using. Some icons are from newer releases and don't work on old links of the repository.
Make sure that the cdn you're using is the newest.
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