How to write a:visited in inline CSS?

Question

Related Topic: How to write a:hover in inline CSS?

I need to create an HTML Email News Letters. All styles should be inline. (According to – http://www.campaignmonitor.com/css/ Not all email clients recognize STYLE tag with in the HEAD tag. but they all prefer inline styles.)

My Problem: The designer wants a dark background color + white links, so I use -

<a href="http://www.mySite.com" target="_blank">   <span style="color: #ffffff;" >ici</span> </a> 

but the default "visited color" is dark.

Is there another way to change the "visited color" ?

Thanks,

Atara.

P.S. I also tried the decrypted BODY link, vlink attributes. did not work.

Answer 1

First off, good luck! HTML email is stuck firmly at 1996 tech levels.

---

One thing to attempt if you don't actually need a separate "visited" colour is to add an !important on the span.

For example, your mail client may have something like this in their style sheet:

a:visited * { color: #000 !important; } 

In which case that will override your inline style.

So, try changing your span to:

<a href="http://www.example.com" target="_blank">     <span style="color: #ffffff !important;" >ici</span> </a> 

to override it back again.

A quick test in Chrome shows that the a:visited * { ... !important} does override the inline style, but adding the !important back to the span works fine.

---

2017 Update

The CampaignMonitor CSS guide now seems to recommend using a <style> element in the head, rather than inlining all styles. Based on other answers this seems to provide the best compatibility with recent version of Outlook.