2 style links

Discussion in 'CSS' started by jrock2004, Jan 30, 2008.

  1. #1
    
    #nav a:link,
    a:visited	{text-decoration: none; display: block; width: 130px; height: 25px; background-image: url(../images/menubg.gif); color: #000000; text-align: center; font-size: 10pt; padding-top: 5px; margin-bottom: 10px; }
    
    #nav a:hover	{background-image: url(../images/menubghover.gif);}
    
    Code (markup):
    That all works up there but I do not want all the links to so that. I only want the ones in the nav do that. But any link I put elsewhere gets the same thing.

    Any ideas on how to fix that so I can style other links differently?
     
    jrock2004, Jan 30, 2008 IP
  2. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #2
    It's the way CSS is built-- anything with the name of a box's id gets precedence. So currently you have #nav a which of course overrides anything you set for just a.

    However, your other links are likely in a box with an id too, right? Like, <div id="main"> or something? So, use that name in the CSS. It will give the two equal footing.

    #main a {
    blah blah
    }
     
    Stomme poes, Jan 31, 2008 IP
  3. St. Anger

    St. Anger Banned

    Messages:
    211
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    try to change the id of each link
    example:
     
    St. Anger, Feb 1, 2008 IP
  4. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #4
    I wouldn't do that unless I was absolutely forced to (like, a script expecting id's on each link).

    If every link within the #nav box are to act the same as each other, no problem. If the other linke (which are certainly in other boxes on the page anyway) are supposed to NOT act like the links within #nav, then my solution should work. Sometimes I have so many menus I have resorted to crap like #main ul li a:hover just to get enough CSS points to make it override some other menu which is also sitting in #main.
     
    Stomme poes, Feb 3, 2008 IP