2 replies to this topic

[hobievi]

Hello all,

We have below definition in our style.css:


.prods_info.big .port_side  {width:40%; }
.prods_info.big .starboard_side  {width:60%; }

When we dpsilay product_info.php in Chrome, product images are properly fit into 240px white frame. However, in IE, the frame gets narrower and photo is trimmed (enclosed screenshots). I read some posts about IE having CSS element size problems but couldnt figure how to modify above to fix both in IE and Chrome.
http://www.hobievi.com/puzzle-eureka-jumbo-puzzle-york-city-jumbo-puzzle-p-2667.html


Thanks in advance.

Attached Files

•  ie.jpg   57.14K   4 downloads
•  chrome.jpg   57.93K   3 downloads

[MrPhil]

I looked at your site with Firefox + Firebug, and there's some very strange things going on:

<div id=piGal	  240 W x 257 H includes main image and thumbnails
<div class=outer	240 W x 257 H
	 <ul	 250 W x 188 H main image white background
	 <li class=wrapper_pic_div 300 W x 400 H !!!!!
		 <a	 300 W x 400 H
			 <img		 250 W x 173 H too wide
			 <div class=caption 250 W x 15 H overlays top of main picture instead of fitting adjacent to main picture

Even if the 300px wide items don't cause problems, you still have an image 250px wide being squeezed into a 240px wide container. I wouldn't be surprised if on some browsers the overflow stretches the container, while on others it cuts off the image. I would carefully check the image size (and maybe the size of other things) specified by the theme you're using -- maybe you have to use 240px wide images?

Did you modify this theme/template, or is this the original code? I'm not very impressed by it.

[viper2626]

Hi, I know this thread is a bit old but I am having some serious problems where does this <div class="outer"> actually happen... I need to edit that line to say <div class="outer" align="center"> but i cant find it anywhere in the product_info.php file does anyone know where it actually is?

Thanks