One Image not showing in Android, IE7, IE8, everywhere else fine - html

Hi I'm testing a Wordpress site I've built, a problem I have is for some reason the Art Below logo which appears just about everywhere else, doesn't show in IE7, IE8 and Android.
Anyone with fresh eyes want to take a look?
Its the footer first logo on the left.
http://www.missingtom.com

Looks like it's a CMYK jpeg. Convert it to RGB and give it a try if it works.
I tested with IE8/7 and indeed it doesnt's show up, shows a red circle, loads just fine with other browsers.
Edit: Here is RGB version of your file - http://i.imgur.com/N8K33he.jpg if you don't know how to do it yourself or you're unable to. Rename it to artbelow.jpg and replace the file on your server (http://www.missingtom.com/wp-content/themes/artwars2/images/artbelow.jpg) make a hard refresh (alt+f5 usually) and see if it shows up.
More info about CMYK and IE (possibly also Android browsers as you stated?... - http://www.plaveb.com/blog/cmyk-images-not-displayed-in-internet-explorer

Related

CSS error on Safari, it works on Chrome

I am trying to make a website and was looking at this template (http://www.uipasta.com/wordpress-preview/rolling/).
I really liked the "testimonials" part and was trying that on my code.
However, I realized that "testimonials" part works totally fine on Chrome with any browser size, but not on Safari.
All the elements of testimonials get overlapped on Safari when I first open it up... It's funny because if I shrink or enlarge the browser and keep doing it like that, the elements stop overlapping and work perfect like on Chrome.
I tried to modify some stuff in css files and tried to find a bug.
But, all the attempts failed in vain... Can someone help me out with this?
LOL I can't even upload more than 2 links yet, because i don't have enough reputation... Here is how it looks on Safari, https://i.stack.imgur.com/kza7d.jpg
but yeah that's how it looks on Safari when it should be clean carousel moving objects.

Why do my webpage images appear sideways in my HTML but correct when in full screen?

If you look at this page, you will see that the right two images are sideways:
http://www.disneypinplace.com/beta/pin.php?id=PD78685
But when you click on them, they appear correctly in full screen view, vertically. I can't see anything wrong in my HTML img code that could cause this.
Can anyone tell me why this is happening? These photos were taken with an iPhone 5 by the way.
This is a particular problem with how the iPhone exports images. Seem this link for a similar situation.
Computers/browsers and iPhone software interpret the camera metadata (details about image, including portrait/landscape) differently thus causing the difference in rendering.
I was able to download the far right image in Pixelmator/Photoshop and save it as a jpg again, making sure it was portrait. This made it so the browser properly rendered the image and did not rotate it 90 degrees.
Were these pictures taken sideways, by any chance? Have you tried editing and "exporting for web" from Photoshop, for example?
Maybe the problem is on the image EXIF (as in you only see the image correctly because the browser reads the EXIF info and rotate it on screen). Exporting it will most likely remove that info from the image file and it might make it correct.
I spent an hour with this that I'll never get back. :)
The Problem
I took the picture on my Samsung GALAXY Tab PRO 8.4. It rendered SIDEWAYS in an Android Emulator as well as in FireFox 42.0.
The Fix
I edited the picture in IrfanView.
I went to Properties_Settings -> JPG_PCD_GIF ->
UNCHECK "Auto-rotate Image according to EXIF info (if available)"
It now renders OK in FireFox. I haven't checked the emulator yet.

Image not showing up in IE8

On my site - http://appliedcodingtech.com/site/factory_automation_photos, an image towards the bottom does not show up in IE8, but it shows up just fine in FF and Chrome. What is wrong?
The broken image is a CMYK .jpg, which IE8 does not support.
It looks like it's an issue with the image (corrupt or whatnot). Just opening the image in a new tab doesn't even work. My advice is take a screen cap of it and save that as Twin_belt_transport.jpg and re-upload it.
I think it is a corrupt image - I used Paint.Net to open the image and re-saved it, and now IE will display it.
Apparently the image is corrupted (applications may handle this in different ways) or is stored in a way that is not supported by IE. Try saving the image again using an image editor.
The problem lies in the image itself. IE cannot open it from disk either. It is indeed a jpg image (it has the 'exif' header), although I don't have the tools at hand to study exactly what's wrong with it.
Good question.
It seems that the image file is corrupted. Re-uploading it would definitely fix it!
But also some pointers
Thumbnails are too big. Use different images for thumbnails and for
view purposes. It loads slow and doesn't look professional at all :(
Your using .jpg and .JPG file extensions. For a more beautiful code,
use only lowercase .jpg!
There are spaces in the filenames. Use _ or -

color compatability issues in Internet explorer and firefox

I got stuck among the weared behaviour of browsers. Ihave a div which has a background image which has color code #fbc61e so i set the background color of div to #fbc61e.
This works well in Inernet explorer. But when I render same page on firefox an edge appears between image and background where image ends.
When I analysed the snapshot of firefox page I got the colorcode of image #fece00 and when I set div background to #fece00 then edge disappears in firefox but appears in Internet explorer.
Please enlighten me to resolve this problem.
Thnx in advance.
You're probably tripping over embedded color profiles, which IE and FF handle differently. Depending on your graphics editor, you should use something like "Export for Web and Devices" (Photoshop/Illustrator terminology). Set your color profile to sRGB to avoid surprises when exporting.
GIFs and 8-bit PNGs are the only safe choices for what you're trying to do, but you can try getting rid of any gamma tags that might have been written out to your file to see if it helps.

IE8 Randomly does not show background images of my divs

I have this annoying problem driving me nuts, IE 8 randomly won't show background images of my divs. One minute it shows, then the next time it won't. Then I have to refresh the page 2-3 times for it to show.
All my pages work fine on firefox, chrome.
Has anyone faced a similar problem? Any solutions?
I had a similar issue but the image would never show in IE8, regardless of how many times I refreshed the page. It worked fine in Chrome and FF (latest versions as of the time of this post).
The image file was created in Adobe Illustrator (CS3) and saved as a JPG. It turned out to be file corruption of the JPG that I resolved by opening the file in Paint.NET, saving as a GIF, opening the GIF and re-saving as a JPG. The issue does have to do with IE8 but Paint.NET had problems with the file as well. I could not save the original JPG as a JPG; I had to switch to another format and then back.
I hope this helps those with the issue I ran in to.