Pro tip: DONT use mso conditionals for emails

You remember that really awesome conditional in HTML that you used to prevent content from showing up in outlook’s desktop client. Yea, that doesn’t work anymore.

If you use:

<!--[if !gte mso 9 ]><!-->
content here

You’ll feel great… but only for half a second. Only until all the hotmail, outlook.com and icloud users complain that their emails aren’t rendering properly. Oh and trust me those people exist. The above code actually breaks the page really magnificently in those webmail clients and various parts of your email will go missing.

So what can you do? Well, I found this neat css property:

<div style='mso-hide: all;'>

It works similarly, but there are caveats of course. This property hides the internal content, but things like height, padding and margin may still exist so you need to zero those out as well. This, of course seems to not always work on all elements.

When is html email going to start sucking less? Why can’t we get all this information in one place. This is why we can’t have nice things people!


Leave a Reply

You must be logged in to post a comment.