Images are scrunched up in IE8
iframed:
http://techmobile.com/storeBETA.html
original site:
http://store-techmobile.blogspot.com/
Why is it doing this? It is alright in IE9.
here’s code for the insertion of the image:
<th class="item_thumb" id="thumb" width="45%"><a href="http://3.bp.blogspot.com/-
k1EQIca2tCw/TdtZUjHTeGI/AAAAAAAACAs/vNwQwZAVkaI/s1600/blue.gif" onblur="try
{parent.deselectBloggerImageGracefully();} catch(e) {}"><img alt="" border="0"
id="BLOGGER_PHOTO_ID_5610175970378217570" src="http://3.bp.blogspot.com/-
k1EQIca2tCw/TdtZUjHTeGI/AAAAAAAACAs/vNwQwZAVkaI/s400/blue.gif" style="cursor: hand;
cursor: pointer; display: block; height: 164px; margin: 0px auto 10px; text-align:
center; width: 148px;" /></a></th>
<td><input class="item_add" type="button" value="Add to Cart" /></td>
</tr>
Is the item thumb width getting scrunched in IE8? I’d like to pinpoint what the cause is before changing settings and writing code. This code is part of a table of code inserted into the backend of blogger.com so a table shows up for posting pics, prices, description details etc. As per BloggerMints instructions:
http://www.bloggermint.com/2011/05/shopping-cart-blogger-template/
I’m on a mac so I don’t have access to IE8’s developer tools. Any insights much appreciated.
And I’m kinda confused on how to write the code because it’s not a simple CSS divert rewrite like:
<!--[if IE 8]>
<link rel="stylesheet" href="css/ie8.css" type="text/css" />
<![endif]-->
It is the float: left on the wrapping span. Either remove that, or set it’s width to 100% or similar. You probably should do this for only IE8 and below.