SitePoint Sponsor

User Tag List

Results 1 to 8 of 8

Thread: Image as a link

  1. #1
    SitePoint Member
    Join Date
    Nov 2002
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Image as a link

    Hello,

    Can you please let me know if there is a way to put "border=0" for IMG in a CSS if image used as a link.
    I put border=0 for IMG and for A:link in CSS but still get border around image after clicking on it.

    Thanks,
    Irina

  2. #2
    SitePoint Wizard Bill Posters's Avatar
    Join Date
    Dec 2001
    Location
    UK
    Posts
    1,523
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I think what you are talking about is Internet Explorer's 'focus border'.

    It's not actually part of the code, but is a 'feature' of the Internet Explorer browser.
    However, it can be removed from your pages...


    between <head></head> tags: (or in an externally linked js file)
    Code:
    <script type="text/javascript">
    
    function unblur() {
    this.blur();
    }
    
    function getLinksToBlur() {
    if (!document.getElementById) return
    links = document.getElementsByTagName("a");
    for(i=0; i<links.length; i++) {
    links[i].onfocus = unblur
    }
    }
    
    </script>
    into <body> tag:
    Code:
    onload="getLinksToBlur();"
    The pros and cons of killing the focus border have been discussed here at length before.
    If you're interested in hearing the issues (and egos) involved (mine included ) then check out this thread.

    It's worth reading them as you may decide that you'd rather keep it after all. You may not.
    Personally, I'm in the anti-focus border camp.
    New Plastic Arts: Visual Communication | DesignateOnline

    Mate went to NY and all he got me was this lousy signature

  3. #3
    Phil fillup07's Avatar
    Join Date
    May 2002
    Location
    Jacksonville, FL
    Posts
    1,168
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Re: Image as a link

    Originally posted by Irina Eremeeva
    Hello,

    Can you please let me know if there is a way to put "border=0" for IMG in a CSS if image used as a link.
    I put border=0 for IMG and for A:link in CSS but still get border around image after clicking on it.

    Thanks,
    Irina
    Not sure if this will make a difference, but try putting it in A:visited and A:hover as well.

  4. #4
    SitePoint Wizard DougBTX's Avatar
    Join Date
    Nov 2001
    Location
    Bath, UK
    Posts
    2,498
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by Bill Posters
    I think what you are talking about is Internet Explorer's 'focus border'.
    Why are people so smart? (Ignore the internal irony please )

    -----------

    What you problaby have is something like this:

    Code:
    a:link img { border-width: 0px; }
    (I'm not acctually sure if that validates, will have to check some time)

    This works for all <a> tags which belong to the pseudo class ":link". When you click on it, it moves to the ":active" class, so the border goes back to the default.

    fillup07 is almost there, but an even better solution:

    Code:
    a img { border-width: 0px; }
    This means that all <img> (image) tags inside <a> tags (even if they are clicked on) will have no border.

    hth,
    Douglas
    Hello World

  5. #5
    SitePoint Member
    Join Date
    Jun 2002
    Location
    Miami Fl
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, another way that I use is simply this:

    Code:
     IMG { border: none; }
    Then, depending upon which class/id any other img link is in, I can change this at will to suit that particular img using code similiar to the above. No need for messy Javascript in this case.
    -= Eric

  6. #6
    SitePoint Wizard Bill Posters's Avatar
    Join Date
    Dec 2001
    Location
    UK
    Posts
    1,523
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Internet Explorer for Mac (my usual browser) has no border for image links by default.
    That lead to my confusion about Irina's point.

    My mistake.
    New Plastic Arts: Visual Communication | DesignateOnline

    Mate went to NY and all he got me was this lousy signature

  7. #7
    SitePoint Member
    Join Date
    Jun 2002
    Location
    Miami Fl
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    *sigh* The world should be ALL mac
    -= Eric

  8. #8
    SitePoint Wizard DougBTX's Avatar
    Join Date
    Nov 2001
    Location
    Bath, UK
    Posts
    2,498
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It does seem a bit strange nowadys to be the default, but its minor

    (and I do belong to the "focus borders are good" camp too )

    FYI, you could do that on IE/win too, by setting a user style sheet...

    Douglas
    Hello World


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
  •