HTML Email Issue: Yahoo! Mail Turning Links Default Blue
Various email clients have different quirks and html challenges - in our HTML email coding section we document these and detail any workarounds if available.
Email Client Affected:
This issue affects the current Yahoo! Mail (ie not Yahoo! Mail Classic)
Issue:
This rendering issue is something we spotted here at e-Dialog during testing in certain versions of Yahoo! Mail. It seems a recent update to the rendering engine now gives all <a> tags a class of .yshortcuts, and as a result can mangle inline style code and force Yahoo’s default link colour instead.
Fix:
The fix is to overwrite the style by declaring our own at the top of the email html (this can go within your <head> tags or within the <body> section).For example, this code snippet will set all links as black:
<style type="text/css">.yshortcuts .yshortcuts a span </style>In order to change link colours for different areas, you can nest classes like so:
<style type="text/css">.header .yshortcuts </style>In this example, you'd add class="header" to the relevant <td>
Limitations:
Unfortunately there's a pretty major limitation to this fix currently, in that it is applied to every link in a given email. This could cause issues, for example, when part of a creative required white coloured links and another part requires black ones.
Discovered:
July 2010More info and discussion on Campaign Monitor’s forums.
