Yahoo mobile tags

Quick question on this topic:

http://www.campaignmonitor.com/blog/post/3457/media-query-issues-in-yahoo-mail-mobile-email/

I downloaded Dave Greiner's mobile template (which was made without the Yahoo code) from here:

http://www.campaignmonitor.com/blog/post/3442/mobile-email-design-in-practice/

Do I change:

. . . .
@media only screen and (max-device-width: 480px) {
         .header {
              font-size: 16px !important;
         }
         .table, .cell {
              width: 300px !important;
         }
. . . .

to:

. . . .
@media only screen and (max-device-width: 480px) {
         [class=header] {
              font-size: 16px !important;
         }
         [class=table], [class=cell] {
              width: 300px !important;
         }
. . . .

or do I need to preface all classes with "table", "td" etc. for it to work?

Thanks!

- Paul

roshodgekiss roshodgekiss, 6 years ago

Hi Paul, yes, you will have to prefix these styles with the HTML attribute, ie:

div[class="header"] {
              font-size: 16px !important;
         }
table[class="table"], td[class="cell"] {
              width: 300px !important;
         }

Thanks for letting us know about this template, I'll make sure I update it to use the new selectors instead. Good luck!


Get in touch with us on Twitter: http://twitter.com/campaignmonitor
We're also on Facebook: http://facebook.com/campaignmonitor

See why 200,000 companies worldwide love Campaign Monitor.

From Australia to Zimbabwe, and everywhere in between, companies count on Campaign Monitor for email campaigns that boost the bottom line.

Get started for free