Header links added in editor appear black in Outlook 2007 and 2010

I have the following template code for a single line title:

<h2 style="font-family:'Trebuchet MS',Verdana,sans-serif; font-size:18px; font-weight:bold; color:#CF0F36;">
<singleline label='Event title'>Event title</singleline>
</h2>

At the top of the template, I also have the following styles:

.featured a, .featured a:link,
.featured a:visited, .featured a:link:visited { color: #CF0F36; text-decoration: underline; }
.featured h2 a, .featured h2 a:link,
.featured h2 a:visited, .featured h2 a:link:visited { color: #CF0F36 !important; text-decoration: none;}

This is what Campaign Monitor 'spits out':

<h2 style="font-family:'Trebuchet MS',Verdana,sans-serif;font-size:18px;font-weight:bold;color:#CF0F36;margin-top:0;margin-bottom:0;margin-right:0;margin-left:0;line-height:100% !important;-webkit-font-smoothing:antialiased;" >
<a href="http://link.com" style="color:#CF0F36 !important;text-decoration:none;" >Event title</a>
</h2>

This all displays great in every major email client (it even fixes the green headings in Hotmail), but in Outlook 2007 and 2010 the heading links are in black.

I know that these clients ignore any inline styles with '!important', but I need that for Hotmail.

Wrapping a span around the text inside the singleline tag is also not feasible, as my client would see that bit of code when editing that text.

I have run out of ideas on how to fix this - any pointers and help is greatly appreciated.

Many thanks,
Katrin

roshodgekiss roshodgekiss, 4 years ago

Hey there katrin, this is very unusual - Outlook is generally fairly respectful of link colors. Would you be able to kindly post your full code here, or kindly contact our team with campaign details? Then we can give it a look and potentially test on our end.

Note that the styles, .featured a, .featured a:link, .featured a:visited, .featured a:link:visited can be simply .featured a, .featured a:visited - I don't know if the invalid selector use here could be an issue, but it's the only thing I can see that's amiss from this snippet.

All the best!


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

Thank you so much for your reply!

Your hunch was absolutely right: Removing the 'a:link' and 'a:link:visited' declarations has fixed this issue - hooray!

roshodgekiss roshodgekiss, 4 years ago

Hi katrin, that's great news - glad we could help out here :D


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

Join 200,000 companies around the world that use Campaign Monitor to run email marketing campaigns that deliver results for their business.

Get started for free
1-888-533-8098