Results 1 to 3 of 3

Thread: Baffled about blue/purple link borders

  1. #1
    Join Date
    Jul 2007
    Location
    California
    Posts
    177
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default Baffled about blue/purple link borders

    It's been ages since I've done a web page, yet I'm going to make one for my best friend. I think I have the CSS correct, but it's obvious I do not.

    Here's the link to the page http://sierramobilesound.com if you want to glance, but basically the blue link border, and purple visited border is showing up on the linked photos.

    Here's my CSS

    Code:
    /*This is the main CSS sheet for format of all pages appearance*/
    
    body {
    background-color: #000000;
    }
    
    #content {
    background-color: #000000;
    position: static;
    display: block;
    width: 100%;}
    
    #logo {
    position: relative;
    top: 25%;
    text-align: center;
    }
    
    #car {
    position: relative;
    top: 25%;
    text-decoration: none;
    margin: 0em;
    padding: 0em;
    text-align: center;}
    
    #car a:link {
    border: none;
    text-decoration: none;} 
    
    #car a:visited {
    text-decoration: none;
    border: none;}
    
    #car a:hover {
    text-decoration: none;
    border: none;}
    
    #car a:active {
    text-decoration: none;
    border: none;}
    #logo is the sierra logo, and #car has the two linked photos in that div. Once I create the home theater photo it will be the 2nd photo in group.

    I'm sure it's silly what I've forgotten, however I would really appreciate any help anyone can offer.

    Thanks!!!

  2. #2
    Join Date
    Jul 2007
    Location
    California
    Posts
    177
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default Had I read into the first page of posts...

    I would have seen that adding img would have solved my problems. Here's the thread which answered my question...

    http://www.dynamicdrive.com/forums/s...ad.php?t=13477

    So strange that on my original website I never ran into the border issue.... hrm...who knows.

    Thanks,

  3. #3
    Join Date
    Jul 2006
    Location
    just north of Boston, MA
    Posts
    1,806
    Thanks
    13
    Thanked 72 Times in 72 Posts

    Default

    Links by default have an underline. An image link by default doesn't have the underline link, but rather a border around the image.

    Also by default the "link" selector or unvisited link is blue, while a visited / selected link is purple.

    To get rid of these, add a CSS border rule to the image links and you will see them disappear

    Code:
    a:link img, a:visited img, a:hover img, a:active {border:none}
    and now any image link on the page will now disappear.

    You did this properly, but whenever you are declaring pseudo selectors, you should do them in the order of
    :link
    :visited
    :hover
    :active

    If you find it difficult to remember that order think of it this way

    LoVe HAte your anchors

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
  •