IE and Firefox Compatibility Issue

The page I designed looks fine in IE however some images do not display correctly in Firefox.

Here is the link to my site. http://berrydog.com/

The problem is with the main / big image on the page. Firefox does not display the images properly.

I can’t figure out the problem. Any help would be appreciated.

BTW I am an intermediate level html person so please do not be to technical.

Thanks,

Doesn’t seem to work in IE either. I am seeing three images (all the same) side by side with the middle image overlapping the other two and set slightly lower.

Perhaps that was the intended effect.

The main problem you have us that you have three images all with different height 255, 265 and 320.

Problem 1: as PT says, the images are different sizes, and the table has to expand to the the height of the tallest one.

Problem 2: tables suck for layout. :frowning:

It’s not even a matter of tables sucking for layout in this case – even if you were to use tables for layout there’s NO REASON for that page to have more than THREE tables – it has almost a HUNDRED OF THEM… Holy hannah…

Inlined presentation in the markup, tags that have no business being used in HTML in over a decade like FONT and CENTER, single TD tables (which is when you don’t use a table), images for text, slicing of an image for no good reason, presentational images in the markup, non-semantic markup – and basically 71k of HTML doing 12-15k of markup’s job… endless javascript for christmas only knows what… (I’m not seeing it actually USED on the page for anything useful).

… and that’s before we talk the accessibility issues of everything declared in uselessly small fixed metric (px) fonts. Anyone tells you to put 9px fonts on a page… Pimp slap, oh snap. Don’t need no gat or a baseball bat just a…

My advice is to throw it all out and start over – the HTML is such a disaster it would take longer to make sense out of it and to drag it kicking and screaming into THIS century, than it would to rewrite the entire thing from scratch.

Thanks for your responses, the image is supposed to be staggered and different sizes, that was by design.

I did figure out what the problem was and it was the spacer gifs. Seems like Firefox has a problem with them. I sliced the image using photo shop CS and then I sliced the image up using a different program which didn’t create spacer gifs and uploaded the images and html again and now it looks fine in all browser including IE9, Chrome and Fire Fox.

You’ve just implemented a bandaid solution. Rapmaster Jason :slight_smile: is correct, this code structure is so obsolete and riddled with structural problems that you will continue to fight it as long as it remains as is. But if you’re happy with it, good luck and success for ya.