SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Enthusiast synth's Avatar
    Join Date
    Nov 2002
    Location
    1, The Way
    Posts
    38
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS borders and linked images...

    Hi all,

    I have a couple of images that are linked, plus a few text links. The thing is, all my links are applied with CSS borders as well
    Code:
    a {
    border-bottom: 2px #ccc dashed;
    color: #000;
    text-decoration: none
    }
    
    a:hover {
    border-bottom: none;
    color: #fff;
    background-color: #ff0;
    }
    Now i'm looking to avoid having those borders getting applied to the images (only want borders on the text links), so I used the code below:
    Code:
    a img {
    border: 0px none;
    }
    Doesn't work. images/smilies/frown.gif

    Any ideas?

  2. #2
    SitePoint Evangelist Aska's Avatar
    Join Date
    Aug 2003
    Location
    Melbourne, Australia
    Posts
    454
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    What if you do this?

    Code:
    a img, img {
       border: none;
    }
    Are you trying to make it work in Netscape 4 as well?

  3. #3
    SitePoint Enthusiast synth's Avatar
    Join Date
    Nov 2002
    Location
    1, The Way
    Posts
    38
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Aska
    What if you do this?
    Code:
    a img, img {
    border: none;
    }
    Are you trying to make it work in Netscape 4 as well?
    same thing..
    no.. nothing about netscape 4.. its an intranet thing you see..

  4. #4
    SitePoint Evangelist Aska's Avatar
    Join Date
    Aug 2003
    Location
    Melbourne, Australia
    Posts
    454
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    bummer... perhaps you may want to assign a class name to all your text links instead? So that when you have:
    Code:
    a.textLink { border-bottom: 2px #ccc dashed; color: #000; text-decoration: none } 
    a.textLink:hover { border-bottom: none; color: #fff; background-color: #ff0; }
    ...they won't be applied to image links? Hope that helps.

  5. #5
    SitePoint Enthusiast synth's Avatar
    Join Date
    Nov 2002
    Location
    1, The Way
    Posts
    38
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks Aska, but if I have to do that, I'll have to go thru a massive number of documents.. aargh.. i've found another way to format my links already (without borders), at least the problem's no more there.

  6. #6
    SitePoint Enthusiast synth's Avatar
    Join Date
    Nov 2002
    Location
    1, The Way
    Posts
    38
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i'll try your solution out on a document or two..

  7. #7
    SitePoint Evangelist Aska's Avatar
    Join Date
    Aug 2003
    Location
    Melbourne, Australia
    Posts
    454
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Smile

    Quote Originally Posted by synth
    thanks Aska, but if I have to do that, I'll have to go thru a massive number of documents.. (snip)
    Yep that is the weak point of my strategy... Unless you want to abandon the use of borders in your text links (and use something like "text-decoration:underline" instead) though obviously it's not quite the same as your "border-bottom: 2px #ccc dashed"

    Cheers~

  8. #8
    Word Painter silver trophy Shyflower's Avatar
    Join Date
    Oct 2003
    Location
    Winona, MN USA
    Posts
    10,054
    Mentioned
    142 Post(s)
    Tagged
    2 Thread(s)
    try taking the anchor off the image

    img {border: 0;}
    Linda Jenkinson
    "Say what you mean. Mean what you say. But don't say it mean." ~Unknown


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
  •