Outlook Links & Text Color

Hi There,

I'm having some problem with the text color not rendered in outlook 2010 as I want it.

Here is the code for the heading block which is shown in outlook 2010 as black.


<td align="center" valign="middle" style="border-collapse: collapse; text-align:center; background-color:#41403e; font-size:30px !important; font-weight:bold; font-family:Helvetica, Arial, sans-serif; color:#e5e0d7 !important;">

<span style="border-collapse: collapse; text-align:center; background-color:#41403e; font-size:30px !important; font-weight:bold;font-family:Helvetica, Arial, sans-serif; color:#e5e0d7 !important; ">
         YOUTH & TODDLER STYLES ON SALE
</span>
</td>


Similar is the case for the text links which is shown in blue.

<td width="115" bgcolor="#41403e" style="border-collapse: collapse; text-align:center; font-weight:bold; font-family:Helvetica, Arial, sans-serif; color:#e5e0d7 !important; background-color:#41403e; font-size:12px;" height="18">

<a href="http://retail.royalapparel.net/youth-kids-infants/youth/youth-s-s-crew-tee.html" title="Shop Now" target="_blank" style="color:#e5e0d7 !important; text-decoration:none;">
SHOP NOW . 5021
</a>
</td>

Any help in this regard will be highly appreciated.

Thanks,

Tahir

roshodgekiss roshodgekiss, 3 years ago

Hi Tahir, happy new year! This is very unusual and we'll desirably have to take a look at all your code to work out what's going on. Feel free to post it here, or by all means get in touch with our team with details and we'll be sure to take a look. Sorry for the delayed response, but we hope we can help here.


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

Hey Tahir,

It's worth using the heading tags for your titles instead of the span it self.  I've managed to fix the issue you're experiencing. Code below bud. 

Cheers
Step


<html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<style type="text/css">

    
    h4 {
        color:#e5e0d7 !important;
    }
    
</style>

<body>
<table cellpadding="0" cellspacing="0" bgcolor="#41403e" align="center" style="border-collapse:collapse; text-align:center; font-size:30px; font-family: Helvetica, Arial, sans-serif; color:#e5e0d7 !important;">
<tr>
    <td valign="middle">
        <h4 style="color:#e5e0d7 !important; font-size:30px;">YOUTH & TODDLER STYLES ON SALE</h4>
    
    </td>
</tr>
</table>
</body>
</html>

A email developer obsessed with gym, coding, design, music, and other things he doesn't understand. Twitter - http://twitter.com/#!/stephenho1mes
mtkhan mtkhan, 3 years ago

Thanks a lot guys for your time.

I have already fixed the issue. I have set the defaults for a tags & defined a separate class for the desired links & called the class in that "a" tag.

a:visited { color: #1b224b !important; text-decoration:none !important;} 
a:focus   { color: #1b224b !important; text-decoration:none !important;}  
a:hover   { color: #1b224b !important; text-decoration:none !important;}


a.shop {
          text-align:center; 
          font-weight:bold; 
          font-family:Helvetica, Arial, sans-serif; 
          color:#e5e0d7 !important;  
          font-size:12px;
          text-decoration:none !important;
      }


Thanks.

roshodgekiss roshodgekiss, 3 years ago

Hi Tahir, thanks for the follow up - glad you got it working :)


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

Join 150,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