Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Failed to show SVG properly

more options

In desktop version of Firefox (version 56.0), the SVG image was displayed incorrectly. For example, with the following SVG image for twitter logo, it shows something that not even close to twitter logo. The same SVG image is displayed properly in other browsers, (IE11, Edge, Chrome, etc.). Is this a bug in Firefox? or there is a workaround to make it work? (two screenshots for working and not-working pages in attachment)

In desktop version of Firefox (version 56.0), the SVG image was displayed incorrectly. For example, with the following SVG image for twitter logo, it shows something that not even close to twitter logo. The same SVG image is displayed properly in other browsers, (IE11, Edge, Chrome, etc.). Is this a bug in Firefox? or there is a workaround to make it work? (two screenshots for working and not-working pages in attachment) <blockquote> <img style="width:640px; height:640px;" src="data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2032%2032%22%20enable-background%3D%22new%200%200%2032%2032%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20fill%3D%22%2355ACEE%22%20d%3D%22M32%2C6.4c-1.2%2C0.5-2.4%2C0.9-3.8%2C1c1.4-0.8%2C2.4-2.1%2C2.9-3.6c-1.3%2C0.8-2.7%2C1.3-4.2%2C1.6c-1.2-1.3-2.9-2.1-4.8-2.1%2Cc-3.6%2C0-6.6%2C2.9-6.6%2C6.6c0%2C0.5%2C0.1%2C1%2C0.2%2C1.5C10.3%2C11.1%2C5.5%2C8.5%2C2.2%2C4.5c-0.6%2C1-0.9%2C2.1-0.9%2C3.3c0%2C2.3%2C1.2%2C4.3%2C2.9%2C5.5%2Cc-1.1%2C0-2.1-0.3-3-0.8c0%2C0%2C0%2C0.1%2C0%2C0.1c0%2C3.2%2C2.3%2C5.8%2C5.3%2C6.4c-0.6%2C0.1-1.1%2C0.2-1.7%2C0.2c-0.4%2C0-0.8%2C0-1.2-0.1%2Cc0.8%2C2.6%2C3.3%2C4.5%2C6.1%2C4.6c-2.2%2C1.8-5.1%2C2.8-8.2%2C2.8c-0.5%2C0-1.1%2C0-1.6-0.1c2.9%2C1.9%2C6.4%2C2.9%2C10.1%2C2.9c12.1%2C0%2C18.7-10%2C18.7-18.7%2Cc0-0.3%2C0-0.6%2C0-0.8C30%2C8.9%2C31.1%2C7.7%2C32%2C6.4z%22%2F%3E%3C%2Fsvg%3E" /> </blockquote>
Attached screenshots

Endret av harver

All Replies (3)

more options

Is this problem specific to the file:// protocol? For example if you compare:

https://upload.wikimedia.org/wikipedia/commons/e/e9/Emojione_1F405.svg

with the PNG:

does that one work?

more options

Hi jscher2000

If you can use the quote link from my original post, you can see the source code of img tag that I am trying to do. For some reason, this forum does not show the source code. I would like to attachment the file that I am testing but it does not allow upload files except images.

Endret av harver

more options

Gotcha.

I don't know why Firefox draws that image the way it does. Hopefully you can find a site more focused on SVG where they may have documentation on browser differences.