I am new to font-awesome icons. I have one page in which there is a filter where user can search the data. I have added font awesome icon just before the search link (as per below screenshot), I can see this icon in all the browsers except IE 11. The funny thing is I have this icon in other pages also and I can see it in IE 11, but I cannot see this icon on this (as per below screenshot) page only.
Here is the screenshot from IE 11:
Here is the screenshot from chrome:
Can anyone help me out on this?
If you installed the Free Font Awesome version but try adding Pro icons to your web pages, they won't show. The solution to this is either you use the alternative free icons or upgrade to a Pro subscription/license.
When you add a favicon to your site, it may not show up since your browser has 'saved' your site as one without a favicon. You need to clear the cache in your browser or use a different browser.
If an icon is not an interactive element The simplest way to provide a text alternative is to use the aria-hidden="true" attribute on the icon and to include the text with an additional element, such as a <span> , with appropriate CSS to visually hide the element while keeping it accessible to assistive technologies.
I had the same issue, I solved it by adding this meta tag as the FIRST tag in <head>
:<meta http-equiv="X-UA-Compatible" content="IE=edge">
Also, according to the official documentation, check the following:
For Internet Explorer: you don't serve files with
no-store
option in Cache-control header (Ref: #6454);
For Internet Explorer and HTTPS: you don't serve files withno-cache
option in Pragma header.
IE has an issue with @font-face
s being delivered with the HTTP-Header Pragma=no-cache
. You can see it recorded on the issue tracker here
Unfortunately the issue is marked as not resolvable but there are some workarounds. The one that worked for me was using a servlet filter that avoids the Pragma header being set.
Other solutions that not worked for me:
Font-awesome disappears after refresh for all ie browsers ie11,ie10,ie9
Font awesome icons becomes invisible in IE after refresh
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