How to write a:visited in inline CSS?
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
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.