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

    Join Date
    Nov 2003
    Posts
    28
    Rep Power
    0

    Question CSS underline color on links??


    Does anyone know if/how I can get a CSS script for link classes that would only change the colour of the underline like the one at the top of Altavista's translate page??
    I have tried viewing the source but can't seem to put my finger on it.

    Any help would be greatly appreciated.

    Cheerz,
    sheermonkey.
  2. #2
  3. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2004
    Posts
    5
    Rep Power
    0
    a:link {
    color:#6699cc;
    text-decoration:none;
    }
    a:hover {
    color:#f60051
    text-decoration:underline;
    }
    a:visited {
    color:#999999;
    text-decoration:none;
    }


    see if that stimulates some brain activity
  4. #3
  5. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2004
    Posts
    5
    Rep Power
    0
    a:link {
    color:#6699cc;
    text-decoration:none;
    }
    a:hover {
    color:#f60051
    text-decoration:underline;
    }
    a:visited {
    color:#999999;
    text-decoration:none;
    }


    see if that stimulates some brain activity
  6. #4
  7. No Profile Picture
    Super Moderator
    Devshed Specialist (4000 - 4499 posts)

    Join Date
    Jul 2003
    Posts
    4,009
    Rep Power
    2791
    Use another tag to override the <A> tag colour.

    Code:
    <html
     <head>
      <style>
       a:hover{color:#f00;}
       a{text-decoration:underline;}
       span.link{color:#000;}
      </style>
     </head>
     <body>
    
      <a href="#"><span class=link>Click Me</span></a>
    
     </body>
    </html>
  8. #5
  9. what's your moniker?
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2003
    Location
    Highland Park, NJ
    Posts
    201
    Rep Power
    12
    to use less code, use borders instead of text-decoration:

    Code:
    a:link {
    text-decoration:none;
    border-bottom:1px solid black;
    }
    
    a:visited {
    border-bottom:1px solid grey;
    }
    
    a:hover {
    border-bottom:1px solid red;
    }
    the text-decoration:none is inherrited by the rest...

    Comments on this post

    • C3P0 agrees : very cool -thank you!!!
  10. #6
  11. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2003
    Posts
    28
    Rep Power
    0
    thankU dudes, PHP-newb + stinkoman helped alot.... awelch didnt do what i wanted it 2 but thnkz 4 tha reply anywayz.

    sheermonkey

IMN logo majestic logo threadwatch logo seochat tools logo