Hiding an HTML email element in Windows Mobile 7.8

Question

I'm trying to find a conditional comment or some method of hiding an HTML block in an HTML email on Windows Mobile 7.8. I ran a battery of tests with Windows Mobile 7.8 and iPhone 7 attempting to find one that would show on the iPhone but not on the Windows Phone. I've found a lot of documentation on hiding on Windows Mobile 7.5 but nothing for 7.8.

The results of my test are below but are as of yet unresolved.

---

20 Conditional comment tests testing Windows Mobile 7.8 and iPhone 7.

• N = Not displayed
• Y = Displayed
• Resolution = N | Y

Test # - Windows | iPhone - Attempt

    <br>T1 - N | N - <!--[if IEMobile]><p>This is IEMobile</p> <[endif]-->  
    <br>T2 - Y | Y - <[if !IEMobile]> All other browsers but on Windows Phone 7.<![endif]>
    <br>T3 - N | N - <!--[if IE]><p>You are using Internet Explorer.</p><![endif]-->
    <br>T4 - Y | Y - <![if !IE]><p>You are not using Internet Explorer.</p><![endif]>
    <br>T5 - N | N - <!--[if IE 7]><p>Welcome to Internet Explorer 7!</p><![endif]-->
    <br>T6 - N | N - <!--[if !(IE 7)]><p>You are not using version 7.</p><![endif]-->
    <br>T7 - N | N - <!--[if gte IE 7]><p>You are using IE 7 or greater.</p><![endif]-->
    <br>T8 - N | N - <!--[if (IE 5)]><p>You are using IE 5 (any version).</p><![endif]-->
    <br>T9 - N | N - <!--[if (gte IE 5.5)&(lt IE 7)]><p>You are using IE 5.5 or IE 6.</p><![endif]-->
    <br>T10 - N | N - <!--[if lt IE 5.5]><p>Please upgrade your version of Internet Explorer.</p><![endif]-->
    <br>T11 - N | N - <!--[if true]>You are using an <em>uplevel</em> browser.<![endif]-->
    <br>T12 - Y | Y - <![if false]>You are using a <em>downlevel</em> browser.<![endif]>
    <br>T13 - N | N - <!--[if true]><![if IE 7]><p>This nested comment is displayed in IE 7.</p><![endif]><![endif]-->
    <br>T14 - N | N - <!--[if (lt IE 9)&(!IEMobile)]>If less than IE 9 and not IE Mobile<![endif]-->
    <br>T15 - Y | Y - <!--[if !IE]>If not IE<![endif]-->
    <br>T16 - Y | Y - <!--[if !lt IE 7]><![IGNORE[--><![IGNORE[]]>If not less than IE 7<!--<![endif]-->
    <br>T17 - N | N - <!--[if !lt IE 7]>If not less than IE 7<!--<![endif]-->
    <br>T18 - N | N - <!--[if IE]>If IE<![endif]-->
    <br>T19 - Y | Y - <!--[if !IE]>--><![IGNORE[--><![IGNORE[]]>If not IE<!--<![endif]-->
    <br>T20 - N | N - <!--[if IEMobile]>Only IE Mobile on Windows Phone 7<![endif]-->

Answer 1

Not an answer in terms of a media query but I discovered that elements can be hidden in Windows Mobile 7.8 similar to the manner in which elements are hidden from Gmail.

@media only screen and (max-width:600px) {
    *[class="desktop"]{display:none !important;}
    *[class="mobile"]{display:block !important;width:auto !important;max-height:inherit !important;overflow:visible !important;float:none !important;}
    *[class="banner"]{width:100% !important;}
}
<!--[if !mso]>-->
    <td class="mobile" style="width:0;max-height:0;overflow:hidden;float:left;">
        <img alt="Placeholder" border="0" src="http://www.placehold.it/100x100" width="0" class="banner">
    </td>
<!--<![endif]-->

Originally I was hiding this block from Gmail and Outlook. The conditional comment covered Outlook and the inline styling to zero out the element was working to hide the element in Gmail. However, I had set the width of the image to 100% and in Windows Mobile, this was causing the image to expand the cell and display. When I changed the width to 0 and added another CSS class to expand it to 100% it worked.

At first I attempted to reuse my broad .mobile class on the image tag but that did not work because that caused the image to display at 100% of it's size, when I wanted it to display at 100% of the containers size instead.

Answer 2

How about:

<!--[!if IEMobile]><!-->
 // Show on everything except IE Mobile
<![endif]-->

Here is some great reference on conditional statements