SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    SitePoint Member
    Join Date
    Nov 2002
    Location
    Melbourne VIC AU
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS Styles Links

    Hi, I've been trying to format my site's fonts with CSS styles, but am having a problem with link styles. They appear as I want them to except for the hover. The hover works until you click on the link then it sticks to the visited format without hover. If I remove the visited it, the hovers return but the colours default into the all format that I have at the bottom.

    I've looked a few sites to see and can't see what I'm doing wrong.

    Thanks.


    Code:
    <tr> 
    	<td height="20" align="center" valign="middle" bgcolor="#000000"><span class="nav"><a href="index.php" class="nav">Weblog</a> 
    	 | <a href="cam/" class="nav">Webcam</a> | <a href="about.php" class="nav">About Me</a> | <a href="gallery/" class="nav">Photo 
    	 Gallery</a> | <a href="faq/" class="nav">FAQ</a> | <a href="links.php" class="nav">Links</a> | <a href="contact.php" class="nav">Contact 
    	 Me</a> | <a href="guestbook/" class="nav">Guestbook</a></span></td>
    </tr>
    Code:
    .nav {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    color: #FFFFFF;
    font-weight: bold;
    Code:
    }
    .nav:hover {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    text-decoration: underline overline;
    color: #CCCC33;
    }
    .nav:link {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    color: #FFFFFF;
    text-decoration: none;
    }
    .nav:visited {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    color: #FFFFFF;
    text-decoration: none;
    }
    .footer {
    font-size: 9px;
    color: #CCCCCC;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    }
    .date {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bolder;
    color: #70001F;
    }
    .subject {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #002D59;
    }
    .time {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    color: #002D59;
    }
    .post {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: #002D59;
    }
    .visitor {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: #002D59;
    }
    .aboutsub {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #CCCCCC;
    }
    .abouttext {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #002D59;
    }
    .faqtopic {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    font-weight: bold;
    color: #002D59;
    }
    .size {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    color: #002D59;
    }
    A:hover { color: #FF0000; text-decoration: none }
    A:link { color: #0000FF; text-decoration: underline}
    A:visited { color: #0000FF; text-decoration: underline}
    DrCorp - Thanh.INFO - ConsoleRadar
    Pride, Passion, Power

    Powered by: Myacen

  2. #2
    SitePoint Addict BenANFA's Avatar
    Join Date
    Apr 2003
    Location
    Bath, UK
    Posts
    353
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Your post appears to have gone wrong as all I can see is blank space for most of the code.

    However I was take a shot in the dark and say that you need to check your styles

    The order that you have the

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

    in your CSS is important as it will apply the last style in the file that applys. That is if the link has been visited and you are hovering over it it will apply the the one of a:visited and a:hover that appears last in your styles.

    The order I have given in the list above is the normal order to get the correct presidence, hover overrides active, visited, link(unvisited), active overrides visited and link and visited overrides link.

  3. #3
    SitePoint Member
    Join Date
    Nov 2002
    Location
    Melbourne VIC AU
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry for some reason it changed all my text to white.

    Thanks for that. It worked. I wonder why I didn't think of reversing the other, I keep thinking it was other way around and the one that I wanted to apply should appear first.

    Thanks again.
    DrCorp - Thanh.INFO - ConsoleRadar
    Pride, Passion, Power

    Powered by: Myacen


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •