I'm aware when catering for Outlook 2007 that you should place of all your CSS inline, rather than in the <head>, but how do you do this for multiple links states, like so:

#footer a:link {
    color: red;

#footer a:visited {
    color: blue;

#footer a:hover {
    color: green;

#footer a:active {
    color: yellow;

Thanks in advance.

2 answers


The above example does not use "inline" CSS. Rather the CSS is written as a separate style rule. True, it's on the HTML page, not an external style sheet, but it's not inline. To the best of my knowledge it's not possible to write inline CSS rules for any of the link states except the basic a:link. Why? Because the other three are pseudo-elements, they don't actually exist in the HTML, so there is no way to write CSS for them in the HTML. You can write an inline CSS style for the link itself, but that's all. Like this:

<a href="somepage.html" style="color:red;">text on the page</a>
Answered over 7 years ago by Steve Wilkison
  • Thanks Steve, that really helps. With that in mind, does it mean that links in the 'visited' state will always have to be blue? Edward Williams over 7 years ago

Someone has done this but seems like Gmail support for in-line hover is not great.

Answered over 7 years ago by Divya Manian