Search code examples
htmlinternet-explorerfirefoxwebp

Internet Explorer and Firefox not showing all images on page


For some reason I've been experiencing a weird problem with my website for a long time now, and I still haven't figured out what is causing the problem.

This is what my webpage looks like in Chrome: (and this is what it should look like in any browser):

This is how it looks in IE11: Image 2

As you can see the third image from the left isn't showing up, yet on Chrome it does show up. This has happened on multiple occasions. I've already checked the width and height parameters and all of those are correct: yet IE says that the dimensions of my image are 283x16px instead of 349x240px (rightclick > properties).

<img width="349" height="240" src="http://exofeed.nl/wp-content/uploads/2015/01/Belgian-film-student-travels-more-than-5000-miles-to-be-friends-with-a-complete-stranger__880-1-349x240.jpg" class="attachment-grid-post wp-post-image" alt="Belgian-film-student-travels-more-than-5000-miles-to-be-friends-with-a-complete-stranger__880 (1)" title="Man reist 8000 kilometer af om een compleet vreemde te ontmoeten van Facebook"/>

The page on which the problem occurs: http://exofeed.nl/ - I'm using wordpress by the way.

Has anyone else ever encountered this problem before? Or does anybody know what could be causing this?

UPDATE: Looks like it doesn't work either on Firefox...

I'd be gratefull for any kind of help!


Solution

  • It's because the image in question is not a JPEG (or GIF or PNG) but rather Google WebP, and Internet Explorer does not natively support such images (and neither do Firefox or Safari for that matter).

    enter image description here

    The easiest solution is to just convert it to JPG.