Why is Chrome rendering so badly?
What am I doing wrong?
PNG fallback for chrome can't be the only solution for this right??
This is how I save the file:
Related
I have two images in my html page that are of webp file type.
<img src="./assets/beros-capak.webp" class="article-image" />
<img src="./assets/mapa.webp" class="article-image" />
But, as you can see in the image above, the first webp image is not loaded and the other is loading fine.
I have tested it on chrome, firefox and safari on iphone, and they are all not loading the first image, while both on android and mac pc load both images with no errors.
Why is that?
It depends on the version of iOS.
All browsers on iOS use WebKit so they are all subject to the same compatibility issues as Safari.
According to https://caniuse.com/webp, WebP is supported on iOS 14 and up.
I have faced next strange behavior in Firefox when use ico file as src in img tag.
When It opens in Firefox (latest version), it has 16x16 format despite of the fact that ico original format is 128x128.
In other browser (Chrome, IE) everything works great.
Just open elephant-128x128.ico in Chrome and Firefox and you will see the difference.
<img height='128' src="http://icons.iconseeker.com/ico/cloth-dolls-icons/elephant-128x128.ico">
https://jsfiddle.net/qwx2sxzg/1/
or
http://icons.iconseeker.com/ico/cloth-dolls-icons/elephant-128x128.ico
Does anybody has idea how to fix this?
Your best bet is to convert ico files to another format, since it is not compatible with all browsers.
Image Format Support For Web Browsers
There is no other workaround for it.
I've created a SVG using Inkscape. Now, I've uploaded it to my page and it shows different in different browsers but I don't know what's the issue.
Firefox: The best render
Chrome: Fails on the left side
For at least, I want that Chrome render equals quality of Firefox render but I don't know how?
SVG File: https://github.com/AdrianArroyoCalle/adrianarroyocalle.github.io/blob/master/city.svg
Web: http://adrianarroyocalle.github.io
Also mention that if I open the SVG with Chrome without an HTML page, it shows like Firefox, but reduced.
I recently made a website that hosts PDFs of scans of a publication. For some reason the Chrome PDF viewer renders the PDFs in magenta, while other browsers render them correctly. I've seen lots of posts about how Chrome renders colors as more saturated, but can't locate anything else on the same subject.
In Safari:
In Chrome:
There appears to a bug in the Chrome PDF viewer (possibly only on OSX): https://code.google.com/p/chromium/issues/detail?id=401118
I have this image:
<img src="images/myimages.png" alt="">
It works only using Safari. It's not shown in Chrome, firefox or Safari 'Mobile' (iPad, iPhone).
Any reason?
Your file seems to be a PSD (Adobe Photoshop) file that has been renamed to .png.
Store it as a proper PNG.