i need css help to remove image bottom link border

Discussion in 'CSS' started by xtreme fever, Jan 19, 2009.

  1. #1
    hello,

    i need css help to remove the bottom link border of an image, see attachment. i am using rollovers for the images then a break for the text so that the image and text are one link. i came across this issue when i upgraded to firefox 3. and yes, i have my image border set at 0px.
     

    Attached Files:

    xtreme fever, Jan 19, 2009 IP
  2. katendarcy

    katendarcy Peon

    Messages:
    115
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Well, as you may (or may not know), the underlining is coming from the default setting of text-decoration on links. If you don't care if any of those particular links are underlined, the easiest thing to do would be to add "text-decoration:none" to your anchor tag declarations. However, if you do want them, you could add a span around the link text and give it a class. Then, set the class to have "text-decoration:underline;". (Still keep "text-decoration:none;" for the whole anchor tag.

    For example, if I understand what you're going for:
    <a href="#"><img src="" /><br /><span class="aText">link text here</span></a>

    That may not be the best solution, but that's what I could think of. Someone else might have a better idea. : )
     
    katendarcy, Jan 19, 2009 IP
  3. xtreme fever

    xtreme fever Active Member

    Messages:
    472
    Likes Received:
    8
    Best Answers:
    0
    Trophy Points:
    95
    #3
    yeah, i know it's coming from the default setting. i was hoping not to use the text-decoration: none, for my links. i will have to try a few things.
     
    xtreme fever, Jan 19, 2009 IP
  4. katendarcy

    katendarcy Peon

    Messages:
    115
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Okay. I do have a question, though. Are the links inside of another div or paragraph? Could you give that element an id or class and set its anchor tags to "text-decoration:none;". I guess that's what I was getting at, but I should've been more clear.

    Something like:
    #divname a{text-decoration:none;}
    #divname a span{text-decoration:underline;}

    Whatever you try, I hope it works out for you.
     
    katendarcy, Jan 19, 2009 IP
  5. xtreme fever

    xtreme fever Active Member

    Messages:
    472
    Likes Received:
    8
    Best Answers:
    0
    Trophy Points:
    95
    #5
    ok, it looks like i'll have to class the image and span class the text to make this work. only a few hundred to go...

    thanks katendarcy. just needed another person's input.
     
    xtreme fever, Jan 19, 2009 IP
  6. katendarcy

    katendarcy Peon

    Messages:
    115
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #6
    No problem. But it sounds like you've got a lot of work ahead of you! : )
     
    katendarcy, Jan 19, 2009 IP
  7. xtreme fever

    xtreme fever Active Member

    Messages:
    472
    Likes Received:
    8
    Best Answers:
    0
    Trophy Points:
    95
    #7
    yes i do. i have to make almost 1100 changes. i have my best friend "find and replace" do the job for me.
     
    xtreme fever, Jan 19, 2009 IP
  8. katendarcy

    katendarcy Peon

    Messages:
    115
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #8
    That's pretty funny, (about your friend.) Well, I wish you the best. Take care.
     
    katendarcy, Jan 19, 2009 IP