I've got my responsive template working in all clients/devices except for Android. Thumbnail images (only) render a width, but not a height. I end up just seeing a sliver of the image that is to the left of the content. I've declared a specific height on the image, the td as an inline style and an attribute and tried every combination of width, height, min-width, min-height in my media query.

Here is the HTML

<table width="100%" border="0" cellspacing="0" cellpadding="0" class="modifyTable" style="min-width:558px;">
<tr>

<!-- this is the cell with the image that doesn't render a full height -->

<td valign="top" style="line-height:normal;mso-line-height-rule:exactly;min-width:150px;width:25%;min-height:200px;height:200px" height="200" align="left"><img src="http://pages.arm.com/rs/arm1/images/processor-IP.png" width="150" height="198" border="1" class="shrinkImgLeft" alt="processor chip" /></td>
<td><img src="http://pages.arm.com/rs/arm1/images/spacer-10px.gif"/></td>
<td valign="top" style="font-family:Arial;color:#58595b;font-size:14px;line-height:22px;mso-line-height-rule:exactly;float:left;width:73%;min-width:398px"><p style="margin-top:0;">content, content, content, content</p>
</td>
</tr>
</table>

Here is the CSS in the media query:

body[yahoo] table[class="modifyTable"] {
clear:both !important;
min-width:100% !important;
}
body[yahoo] table[class="modifyTable"], table[class="modifyTable"] td, table[class="modifyTable"] tr { /* Force table to not be like tables anymore /
display: block !important;
width:100% !important;
}
body[yahoo] table[class="modifyTable"] tr, table[class="modifyTable"] td { /
Behave like a "row" */
text-align:left !important;
white-space:normal !important;
padding:0 !important;
}
body[yahoo] table[class="modifyTable"] td:empty {
display: none !important;
}

body[yahoo] table[class="modifyTable"] td:first-child {
float:left !important;
width:25% !important;
height:100% !important;
line-height:100% !important;
margin-right:2% !important;
display:block !important;
min-width:25% !important;
min-height:100% !important;
}
body[yahoo] table[class="modifyTable"] td:nth-child(2n) {
display:none !important;
}

body[yahoo] table[class="modifyTable"] td:nth-child(3n) {

float:left !important;
width:73% !important;
min-width:73% !important;
}
body[yahoo] table[class="modifyTable"] td p {
margin-top:10px !important;
float:left !important;
}
body[yahoo] table[class="modifyTable"] img.shrinkImgLeft {
margin-top:15px !important;
float:none !important;
width:100% !important;
display:block !important;

}

Any help is appreciated. Thanks!

AC