font-awesome

what's the effect of aria-hidden in fontAwesome? Is it necessary to use it? why? or why not? for example I want to know the effect of aria-hidden="true" in the code below <i class="fa fa-star" aria-hidden="true"></i> please help me. In short, it makes the icon not visible to screen readers, to enhance accessibility. From the documentation : If you're using an icon to add some extra decoration or branding, it does not need to be announced to users as they are navigating your site or app aurally. Additionally, if you're using an icon to visually re-emphasize or add styling to content already

I uploaded the files to my server but I'm only using 5 icons in my site. How can I delete the Font Awesome icons that I will never use? Like the useful and beautiful Stethoscope. http://fortawesome.github.io/Font-Awesome/icon/stethoscope/ Thank you It sounds like you copied the entire font-awesome directory into your project, and this isn't the result you are looking for. If you only want 5 of the Font Awesome icons in your project, and not have the balance of icons available for future use, take a look at Fontello . Fontello is an icon fonts generator which allows you to pick and choose only

I am using font awesome icons and I need to have a disabled state of the icons. is there any way to do this. I am also using bootstrap. This is how I am using icons. <i class="fa fa-slack"><i/> I just need the icon to look like grayed out. Neville Write a custom class for disabled Something like .fa-disabled { opacity: 0.6; cursor: not-allowed; } Adding cursor type is important for users experience. You could define your "Bootstrap-like" disabled class .fa.disabled, .fa[disabled], .disabled > .fa, [disabled] > .fa { opacity: 0.5; /*optional*/ cursor: not-allowed; /*optional*/ pointer-events:

I am trying to include font-awesome with webpack. The below import 'font-awesome/css/font-awesome.css'; or require('font-awesome/css/font-awesome.css') produces the following error ERROR in multi vendor Module not found: Error: Can't resolve 'font-awesome' in '...' @ multi vendor Whats wrong? font-awesome is already installed I am using fountain.io , the full webpack config looks like: const webpack = require('webpack'); const conf = require('./gulp.conf'); const path = require('path'); const HtmlWebpackPlugin = require('html-webpack-plugin'); const ExtractTextPlugin = require('extract-text

Looking through the examples on the fontawesome website , I notice a few make use of the class fa-fw . For example: <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i> I have tried with and without it and I cannot see any notable difference. What is the purpose of the fa-fw class? MBaas Fixed Width Icons I've opened the sample page in Chrome, opened inspector on the "Library"-Element of the fw-sample and removed the fw -class. This messes up the icon-alignment - and that is also mentioned as the purpose of fw: ensuring proper alignment of the icons :-) Icon size, some icons are bigger, if you

We contributed to font-awesome 5 (yea), and we are looking from moving from our existing icons (Symbol set) to font-awesome. Will the naming of icons and usage of font-awesome 5 be backwards compatible with font-awesome 4.7? IE: Should we go to 4.7 now, and have very easy upgrade to 5.0? OR should we hold off until font-awesome 5 comes out? It's not backwards compatible. I just publish a script to do the migration from 4 to 5 in: https://github.com/estebandelaf/scripts/blob/master/fontawesome4to5.sh PS: I know the post is from a year ago, but is the second result in google for "fontawesome

I am trying to create a googleMap that uses dynamic fontAwesome markers I can't seem to be able to set 'Font Awesome 5 Free' as the font to be used, though. I can set 'Fontawsome' which works, but is not a webfont (It's a .TTF installed in MY system) var marker0 = createMarker({ position: new google.maps.LatLng(33.808678, -117.918921), map: map, icon: { path: google.maps.SymbolPath.CIRCLE, fillColor: '#F00', fillOpacity: 1, strokeWeight: 0, scale: 15 }, label: { fontFamily: "FontAwesome", fontWeight: '900', text: eval("'\\u"+'f0ab'+"'"), color: 'white' } }, "<h1>Marker 0</h1><p>This is the

I have a file input button, instead of browse I want to show Font Awesome upload icon there but whatever I tried nothing gave me result. Here is what I've tried: .select-wrapper { background: url(http://s10.postimg.org/4rc0fv8jt/camera.png) no-repeat; background-size: cover; display: block; position: relative; width: 33px; height: 26px; } #image_src { width: 26px; height: 26px; margin-right: 100px; opacity: 0; filter: alpha(opacity=0); /* IE 5-7 */ } <div class="container"> <span class="select-wrapper"> <input type="file" name="image_src" id="image_src" /> </span> </div> By above code I only