Yahoo fixes its problems with media queries
At the beginning of February, Fresh Inbox started a campaign to ask Yahoo to fix its incompatibility with media queries we use to make our emails responsive. The problem was that Yahoo applied the latest rules declared within our media queries even though they were desktop resolutions, which threw our entire layout out of whack and forced us to look for hacks to avoid disaster.
The solution found was to structure the CSS rules with attribute selectorsbecause Yahoo does not interpret them, and would therefore ignore them and keep the inline style applied. This caused our styles to look like this:
But a few days ago, Fresh Inbox gave us the good news. Yahoo seems to responsive to the demands of developers and barely a month after the request, he replied fixing the bug and supporting responsive design.
Take note, Gmail
So, email developers can get rid of the attribute selectors and declare CSS rules "like normal people".
But that's not the only good news, as in addition to fixing the problem, Yahoo now provides support for responsive design in both Webmail and its mobile applicationHowever, not all the filters we can apply will work. Yahoo seems to understand the most commonly used ones without any problems: max-width and min-widthbut max-device-width, min-device-width, -webkit-min-device-pixel-ratio are left unsupported. We will also encounter problems if we use multiple filters in a media query. That is, this code will work correctly:
But if we add another filter, as in this example, it will not work.
In addition, Yahoo, according to Mark Robbinsyahoo, offers us the possibility to select only its client in case we want to apply specific styles or correct bugs that may occur in its service. This can be done with the filter "yahoo" in a media query, in this way:
All in all, good news for the email industry. And don't forget that we are still hounding Gmail to get its act together to solve the problems with responsive design. You can retweet this tweet from Freshinbox to join the petition:
Hi @google, when will @gmail be "mobile friendly"? http://t.co/nj8vI4IVh1 #SupportMediaQueries #CanHasStyle
- FreshInbox (@FreshInbox) March 27, 2015
