Hi Mark, Shopify is just one of the stores types! We also have BigCommerce and WooCommerce stores
Knowing the width or height doesn't help with dealing with landscape/portrait issues either I don't think.
One image might be landscape, another portrait, side by side and the containing cell height must be the same (hence fixing the height with a table in Outlook). Because this is a product recommendation tool, the images are dynamic, the user doesn't touch them.
Here's an improvement so we're only including image code once but wrapping a table to fix the height for mso images (based on 2x3 image ratio)- still not ideal as if you're using a landscape image, the cell height is quite large.
<a href="https://becs-conversio.myshopify.com/products/animal-print-hair-band-various-colours?receiptfultype=recin" target="_blank" rel="noopener noreferrer" style="outline: 0px; border: none; text-decoration: none;"><!--[if gte mso 9]><table width="100%" align="center" border="0" cellspacing="0" cellpadding="0"><tbody><tr><td height="330" align="center" ><![endif]--><img class="product-image img-rsz" width="220" style="width:auto;height:auto;max-width:220px;max-height:330px;display:block;" src="https://cdn.shopify.com/s/files/1/0004/3283/2573/products/600_DB187_Hair_Band_Silver_Leopard_PrintPS_480x480.jpg?v=1519397701" alt=""><!--[if gte mso 9]></td></tr></tbody></table><![endif]--></a>
I recommend if you don't want the phone number to look like a link when hovered over, try
cursor: pointer in addition to the other css
I've been testing this for the past hour and a half as had a customer complaint about it. I've tested on
Sony Xperia M4 Aqua with Android 5
Samsung Galaxy Mini with Android 4.3
Samsung Galaxy J3
Validated code with W3, all fine.
On the J3 and the Xperia, I got the cropping, on the other two I didn't. Since it seems to be a physical length issue I tried again with a super long image.
Removed one item of content where the cropping occurred. Cropping on iPhone (halfway through some text, physically through the letters), big blank area underneath where the content should've been. All other devices OK!
Tried putting the removed item of content above the long image to see if it was the code in this block causing the issue. All displayed correctly.
Reopened original email causing issues. All displayed correctly.
Resent the original email. Xperia cropped. Closed and reopened, displayed correctly.
Totally bizarre but seems like a loading issue (from my experience)