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, 5 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

200,000 companies around the world can't be wrong.

From Australia to Zimbabwe, and everywhere in between, companies count on 
Campaign Monitor for email campaigns that drive real business results.

Get started for free
1-888-533-8098