Stop Yahoo! Mail from Rendering Your Media Queries

Yahoo Mail does not like medial queries. It will remove the query and apply the styles inside the query, which will then be applied to all who receive the email.

To fix this, use attribute selectors, which Yahoo will ignore.

@media only screen and (max-device-width: 480px) {
  *[id=smallScreen] {width:100px; padding:2px;}
  *[class=desktop] {width:500px; padding:10px;}

This fix came from Michelle Klann

Michelle referenced a Campaign Monitor article.

It's only fair to share...Tweet about this on TwitterShare on FacebookEmail this to someoneShare on Google+
This entry was posted in Email Dev, Mobile and tagged , , , , . Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *

Time limit is exhausted. Please reload CAPTCHA.