Updated 25/08/2014: I've finally pinned down the cause of this behaviour properly.

You may notice font sizes being inconsistent when Windows Phone renders email in Outlook Mobile. Usually this behaviour is observed with Exchange ActiveSync mailboxes, because of the lack of responsive design with EAS.

Small font sizes

Windows Phone font size issue

The font size set of the test results table is 18px but displays at a smaller view. The reason for this? Its because that table uses pixel widths on the label and red/green block table.

The problem

Here's the issue, if a table has a fixed pixel width, the font size becomes very small. Its not just limited to that though, here a few other reasons as to why it happens.

  • <table> has a width attribute with a pixel width defined
  • <table> has a height attribute with a pixel height defined
  • <table> has no width attribute set

In the example above, both the test name label and the red/green box both have pixel width and height values.

One thing I did discover, If you need to set a fixed pixel height, do it on the table cell, this doesn't cause any issues, but doing it on the containing table will.

Using percentage based widths

Windows Phone font size issue

The fixed example email differs slightly because during testing of how Windows Phone font sizes behave, new tests were added to the email rendering test template, which can be found on GitHub here

Updating the HTML template in the first image with percentage based widths allows the elements within the results table to be displayed properly on Windows Phone.

Note: This behaviour will not occur on Windows Phone with POP3/IMAP mailboxes, providing the document mode of edge is forced, and the viewport tag is used.