More Link Color Troubles

  • Update: It works in Firefox 0.8, but not in IE6 (my default).
    This one is annoying.
    I’m playing with the link colors. For the story title I want a and a:visited to be black and to be red on hover. So I did this:
    .storytitle a, a:visited {
    text-decoration: none;
    color: #000000;
    }
    .storytitle a:hover {
    text-decoration: none;
    color: #b22222;
    }
    Ok, that works fine. Now I want the links in my entries to be the opposite, red on a and a:visited and black on hover. So I do this:
    .storycontent a, a:visited {
    text-decoration: none;
    color: #b22222;
    }
    .storycontent a:hover {
    color: #000000;
    text-decoration: none;
    }
    This works too…kinda. It does what it needs to to the entry links, but it also changes the story titles to red, for all of the link types (a, a:visited, a:hover). I take out the storycontent link info, and the other goes back to normal.
    Any suggestions?

Viewing 2 replies - 1 through 2 (of 2 total)

  • you need to write your css like this:
    .storytitle a, .storytitle a:visited{
    text-decoration: none;
    color:#000000;
    }
    and
    .storycontent a, .storycontent a:visited {
    text-decoration: none;
    color: #b22222;
    }
    it’s also important to note that at the top of your css document you have a:hover specified as #b22222 … so because you don’t specify ‘.storytitle a:visited’ it reverts to that value (css has a parent/child hierarchy).
    give that a try and you should get the desired results.
    **also, i noticed this at the top of your css document …
    a, {
    color: #b222222;
    }
    just happens to be one ‘2’ too many
    HTH — michael

    Thread Starter culturec

    (@culturec)

    Doh! Should have noticed that. Thanks.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘More Link Color Troubles’ is closed to new replies.