IE - but only in some versions?

HTML & CSS
1

Hi,

This one has got me smaking my head against the wall! Typically, IE being crap again.

If you check this page in IE 7 Chrome or Firefox, you will see it show up the “radar” image fine.

CancunMX.com - Cancun Weather Radar

Yet in IE 8 and 9 it won’t show the image. The rest of the page shows up fine, just not that image!

Can anyone see what I’m missing? Its driving me up the wall!

TIA

Andy

2

I don’t have 8 with me now, but is it possible that the size of the td is cutting it off?

Set a border or bg colour on that td, do the same (but different colour) for the center tag, and so on and see if they are both at least as big as they need to be to show the image.

Then click on the image url in those browsers: will they show it on itself (they should)?

Best I can think of for now. Beyond that I’d start suspecting either some crazy table bug or some crazy Joomla! bug.

3

Your HTML markup fails with great success which is one reason it doesn’t work right in IE, currently you have 647 errors and 56 warnings.

[Invalid] Markup Validation of http://www.cancunmx.com/cancunradar.htm - W3C Markup Validator

4

Very true - but I don’t think thats the problem. I copied the HTML from that page, and then opened it locally in IE 8, and it works fine!

The reason that code is so aweful is that its historical, and the site owner can’t afford to re-do the whole system (nor would I really want to get involved in it, as I not versed in the template system for Joomla)

Cheers

Andy

5

Thanks for the reply. The weird part, is that it works fine when looking at the EXACT same HTML on a local .html file in IE … just seems to be when looking at it on this page :confused:

Cheers

Andy

6

Can IE reach the image by itself via the web?

Normally I’d say it was a permissions issue or something, but this image isnt’ on your server, right? You are calling it from the web, from some other website?

Maybe you’ll need to download the image and host your own copy on the server… run a cron job that does this every 10 minutes or something (doesn’t sound like a good idea but it’s an idea).

7

Thanks for the reply. I actually saved the HTML of that page, and then uploaded it to another test domain, and the image works fine (no tweaks to the HTML though) … so its gotta be something server related. I suppose another option, would be to make a CSS class with a background: url() and then have that point to the image. Not ideal, but again , its an idea :slight_smile:

I’ll keep you posted

Cheers

Andy

8

Removing the empty “height” and “width” attributes from the image element the image shows up.
IE 8 and IE 9 comes with developer tools (F12), use it to help in the future.

9

Thanks - not sure what you mean though? The HTML I have is:

<img src="http://smn.cna.gob.mx/radares/cancun/rad-canc.gif" style="background: none repeat scroll 0% 0% grey" border="0" height="796" width="730" />

…so they are not “empty” ?

TIA

Andy

10

Something is blanking them out. I’m going by what I see in the developer tools.

11

Ah I see what you mean - its coming up with “resized to 1px” for me. I have a feeling it was a “fix” the guys did for a hack attack the site had a while back - I hope they simply didn’t just “hide” the images that were the hacking ones :frowning:

Cheers

Andy

12

Well, dont ask me why - but when doing it as a CSS class, it works!

CancunMX.com - Cancun Weather Radar

#radar {
   background: url(http://smn.cna.gob.mx/radares/cancun/rad-canc.gif);
   width: 640px; height: 660px;
}

I do wanna find out why it was doing that though, and I’m hoping the developers who “fixed” that hack attack last time will be able to shed some light!

Thanks for the help and suggestions, much appreciated :slight_smile:

Cheers

Andy