Product Image cropped when description text uses italic / <em></em>

[beeteetwo]

Hi,
I'm experiencing a strange issue only in IE 7 with product images being cropped on the product page.

I am using Zen Cart v1.3.9b

I have searched the FAQ & have not seen any similar issues reported. If anyone has any info or ideas for me they are MUCH appreciated. I am stumped.


Some product pages are displaying a cropped/cut off image in IE 7.
It seems to be related to the use of the <em></em> tag.
The crop happens at the line the <em> tag is used.
If I remove the <em> tag from the description text the image displays properly. I really need to use the italic text to indicate the titles for these descriptions.

Here is an example.

http://www. h i l l s t e a d .org/giftshop/index.php?main_page=product_info&cPath=2&products_id=12&zenid=29f2b6e3c33a304193 08a8dc6dffa94f

This product uses italic text in the product description, but it is displayed properly:
http://www. h i l l s t e a d .org/giftshop/index.php?main_page=product_info&cPath=2&products_id=10&zenid=29f2b6e3c33a304193 08a8dc6dffa94f


Any ideas?

[Celtic]

beeteetwo,

I had a good trawl across the web, and it appears that IE7 has issues with EM and various other things. The apparent 'fix all' is to put a position:relative in the css...

#productMainImage {
MARGIN: 0em 1em 1em 0em;
position:relative;
}

Oops, just noticed you're a new zenner, so welcome aboard. To fix the problem you will have to edit your stylesheet, which is located at:
http://www.hillstead.org/giftshop/in...stylesheet.css

In there you will find, just passed half way down, the #productMainImage definition. Just add in the position:relative; line as shown above and see how it goes.

Oops, just looking in your css file, yours shows it as:

/*Image Display*/
#productMainImage, #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage {
margin: 0em 1em 1em 0em ;
}

So stick the position:relative; just before the closing }

[beeteetwo]

Hi Celtic,

First of all - THANK YOU!
Your instructions worked perfectly!

This is my first time using Zen Cart & my first time posting in these forums.
Thanks so much for the nice welcome and for talking the time to search for a solution for such a random, strange browser issue!

Your instructions were also amazingly detailed. Thanks for reviewing my code & directing me to the right spot.

You made me one very happy newbie!