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

    Join Date
    Jun 2000
    Posts
    61
    Rep Power
    15

    CSS problem when mouse hovers over link - doesn't always work


    I'm having a problem with CSS on my site. I want links to change color and be underlined when the cursor moves over the link. It seems to work for some links but not others. I've tried this with both Mozilla 1.4 and IE6 and they both exhibit the same problem.

    This is my site:

    http://pixellent.stodge.net/wiki/vie...&page=HomePage

    And this is the CSS code I have:

    Code:
    a:link {
    	font-family: Verdana, Arial, Helvetica, sans-serif;
    	color: #5F7383;
    	text-decoration: none;
    }
    a:hover {
    	font-family: Verdana, Arial, Helvetica, sans-serif;
    	color: #006A92;
    	text-decoration: underline;
    }
    a:visited {
    	font-family: Verdana, Arial, Helvetica, sans-serif;
    	color: #5F7383;
    	text-decoration: none;
    }
    Can anyone see any obvious mistakes?

    Thanks
  2. #2
  3. No Profile Picture
    The New User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Location
    CA, USA
    Posts
    109
    Rep Power
    11
    CSS stands for Cascading Style Sheets. This means that as you go down the priority order, code can be overriden. This is what is happening here. I don't know if you noticed but all the links that work are the ones you have NOT visited b4, and all the ones that DONT work are the ones you have visited. The reason this occurs is because your a:visited is overriding your a:hover. To solve is simple. Move a:visited above a:hover, and below a:link, and all should work .

    Hope that helps,
    --Neil
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2000
    Posts
    61
    Rep Power
    15
    Well I'll be.....

    How simple was that!! lol

    Thanks - appreciate it
  6. #4
  7. No Profile Picture
    The New User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Location
    CA, USA
    Posts
    109
    Rep Power
    11
    Haha, yeah, I once had that problem too... Just always remember, the order is link,visited,hover,active...

    --Neil

IMN logo majestic logo threadwatch logo seochat tools logo