Thread: IE, CSS & Links

    #1
  1. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2001
    Location
    Midrand, South Africa
    Posts
    154
    Rep Power
    13

    Question IE, CSS & Links


    I want to have a hover effect on the links of my page. I'm using an attached stylesheet to define it. Here is the section defining the links:

    Code:
    a:link {
      color: red;
      text-decoration: none;
    }
    a:hover {
      color: blue;
      text-decoration: underline;
    }
    a:visited {
      color: red;
      text-decoration: none;
    }
    a:active {
      color: red;
      text-decoration: underline;
    }
    Normal links appear red and is not underlined. When the cursor hovers over a normal link, it appears blue and is underlined.

    However, visited links do not 'behave' as normal links. They appear red and are not underlined. When hovered over, they do not change color or get underlined.

    I want visited links to act the same. They only way I could get them to act the same was to do the following:

    Code:
    a.general:link {
      color: red;
      text-decoration: none;
    }
    a.general:visited {
      color: red;
    }
    a.general:hover {
      color: blue;
      text-decoration: underline;
    }
    a.general:active {
      color: red;
      text-decoration: underline;
    }
    This is the only rules IE will obey. But every link need to be defined as instances of class "general". Is there a better way of handling this?
    Neil Craig
    Software Developer
    SourceCode Techonolgy Holdings Inc
    South Africa
  2. #2
  3. |<.+#f@#+.&.|
    Devshed Loyal (3000 - 3499 posts)

    Join Date
    Mar 2002
    Location
    norway
    Posts
    3,009
    Rep Power
    1224
    you are close to the answer,

    in the example with the a.general the pseudo-classes are in the right order.
    you just have to rearrange the order of the others.

    a:link
    a:visited
    a:hover
    a:active

    http://www.w3.org/TR/CSS2/selector.h...pseudo-classes

    to read more about why the order is important
    http://www.meyerweb.com/eric/css/link-specificity.html
    Last edited by Akh; May 27th, 2004 at 05:54 AM.

IMN logo majestic logo threadwatch logo seochat tools logo