SVG favicon won't show up anymore - html

I have the problem that my .svg favicon won't load anymore in any browser (IE, Edge, Chrome).
Cache is already cleared, also restarted Browser and tried Incognito-mode.
It's still reachable: favicon
Link to website
Code in head-Tag:
<link rel="icon" type="image/svg+xml" href="favicon_v1.svg" sizes="any"/>
Some hours ago I tested it on an other pc with chrome (same version) and edge and it worked there. I changed some things in the code but not the favicon-code.
Does anyone has an idea what the problem could be?

As you can see here, SVG favicons aren't anywhere near to being production-ready, why would you expect it to work in the first place?
You saying "doesn't work anymore" would suppose that you tested it with Firefox or Safari earlier, as those seem to be the only ones who kind-of support it.

Related

Why is the link to favicon element commented out on build?

I have been trying to use my own favicon on my vue.js project for some time. I replaced the original vue favicon with my own and it would not work.
I have tried everything every troubleshooting step I can find. Cache cleared, waited a few days, a query to override cache etc
I think I have now narrowed down the problem but cannot understand why it occurs. When I inspect the built web-app in the browser the link element which references the favicon shows the following:
<!--[if IE]><link rel="icon" href="/favicon.ico"><![endif]-->
The element is commented out and seems to have an if statement attached to it. Why is this?
Its a fallback when you are visiting the website in Internet Explorer below version 11
Internet Explorer <11 doesn't support .png images to be used as favicons, but only .ico files. Support for .png and .gif files only became supported from version 11 and onwards.
So thats why it has the if statement around it, the corresponding element will only be parsed when the browser is IE <11
Note that the <!--[if IE]><![endif]--> is only recognized by Internet Explorer 10 and versions below IE 10
https://learn.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/compatibility/hh801214(v=vs.85)?redirectedfrom=MSDN

CSS caching Chrome VS Firefox

I have a problem with CSS caching in Firefox. I'm creating a website which includes a frame within the page.
However, I don't know why, but there's a big difference between loading time from the page and from the frame.
More surprising, it doesn't happens on Chrome, only in Firefox. That's the reason why I'm suspecting Firefox having a different CSS cache system than Chrome.
As it's .LESS CSS, I though that this was because the .less was compiled and it took a lot of time. But I can't find out why this only happens on Firefox. If it was due to the compiling time for the .less, it would also happen on Chrome, isn't it ?
Does someone have some clues ?
Thanks

Google WebFont not rendering in Internet Explorer 9

I have a website. It uses 2 Google webfonts for its headings and body text. These work fine on Chrome/IE/Safari (including mobile) but when I view the site on my office computer running IE9 on Win7 the Google fonts do not load and fall back to a sans-serif.
Here is what I see:
IE9:
Chrome:
I cannot figure out why IE fails to load the font as I am aware that Google font's are compatible with IE7+. I figure it might be a security setting but can't get to the bottom of it. Any ideas.
I don't know if this is the issue, but try changing your request to only one link tag:
<link href='http://fonts.googleapis.com/css?family=Oswald|Lato' rel='stylesheet' type='text/css'>
Perhaps loading two fonts in two different requests causes issues.
On my IE9 it looked the same as in Chrome. Press F12 and make sure you are using proper Browser and Document Mode.

Image not being loaded in IE9

On my test facebook page's application I am displaying an image which is loading fine on Chrome/Firefox but fails to load on IE9, all I get is 304. I have been browsing around similar IE9 issues but have not found a satisfactory answer for this problem. I also cleared TIFs in IE9 which has removed all the 304s but is changed the status of image file as "(Aborted)". Attached is a screenshot for both Chrome and IE9.
in Chrome-
in IE9-
status in IE9-
adding "http://" in the img src field displays it fine for me in ie9 on jfiddle...

Text flow out of divs in chrome, but not on all chrome users?

I got a really strange problem, and after so much tries and research I can't get out of it.
I have a website, but SOME (just 5% of visitors) people with the SAME version of chrome, see the text flowing out of divs and text overlapping. It's very strange because I tested the website on all chrome browsers using browser testers, without any problem. And in internet explorer or firefox this problem never happens...
A page is located here
And here are some screenshots of what SOME people see (maybe you won't see this in chrome)
click here
Maybe it is because of the font face I am using? Or maybe some bad coded CSS?
Please help me out of this!
Thanks a lot!
I see you use .svg font. Recently I was hunting some Chrome font rendering bugs and saw this:
http://code.google.com/p/chromium/issues/detail?id=95102
This seem very similar to issues you are having. You could try to serve some other font type to Chrome and if this would fix that.
If you don't want or can't serve some other font type to Chrome, the only thing you can do is wait until Chrome version 24 is out to all users which should be soon (I can't find any announcement)
I tested it in
Chrome 23.0.1271.97 m
Chrome 26.0.1371.0 canary
Chromium 25.0.1334.0 (169326)
# Windows 7 x64 and your page seems fine for me.