39 users online (0 members and 39 guests)  


  Results 1 to 6 of 6

Related

  1. Replies: 1
  2. print "Location... in firefox not working    Forum: CGI Perl Forum
    Replies: 1
  3. Replies: 10
  4. Active Links    Forum: HTML Forum
    Replies: 11
  1. #1
    tjanson's Avatar
    New User

    Status
    Offline
    Join Date
    Jul 2004
    Posts
    14

    a:active not working in FIrefox or Netscape

    Hi all. I would be much appreciative of your help on this. I have spent far too long trying to figure out why my a:active css is not working on the thumbnails below the large image when you click on one. Works fine in IE, Thanks so much for your input.

    Offending CSS:

    a.thumbnailuw:visited {
    display : block;
    border : 2px solid #000000;
    }

    a.thumbnailuw:hover {
    display : block;
    border : 2px solid #65ADE7;
    }

    a.thumbnailuw:active {
    display : block;
    border : 2px solid #65ADE7;
    }

    Site I'm applying it to:
    http://www.johntorrente.com/index.html

  2. #2
    ALL's Avatar
    Super Dooper Nerd

    Status
    Offline
    Join Date
    Feb 2005
    Location
    localhost
    Posts
    382

    Re: a:active not working in FIrefox or Netscape

    what browsers is this sample not working with?

  3. #3
    tjanson's Avatar
    New User

    Status
    Offline
    Join Date
    Jul 2004
    Posts
    14

    Re: a:active not working in FIrefox or Netscape

    Firefox 1.0.4 and Netscape 8.0.4 for Windows

  4. #4
    ALL's Avatar
    Super Dooper Nerd

    Status
    Offline
    Join Date
    Feb 2005
    Location
    localhost
    Posts
    382

    Re: a:active not working in FIrefox or Netscape

    i dont have either one of those in may computer... if i was using my computer i could have done it, but i dont have my computer... i am sorry

    -ALL

    i am sure somone else can help you!

  5. #5
    Chaoseeker's Avatar
    New User

    Status
    Offline
    Join Date
    Mar 2009
    Posts
    1

    Re: a:active not working in FIrefox or Netscape

    any value put on a:active will only be seen as you are clicking on the link.
    to achieve your goal you'll need to do something like this:

    <ul>
    <li>blue</li>
    <li id="active">black</li>
    <li>green</li>
    </ul>

    By giving your element a unique name, you can style it using CSS:
    #active {
    color: blue;
    }

  6. #6
    markei's Avatar
    New User

    Status
    Offline
    Join Date
    Mar 2009
    Location
    Westminster, MD
    Posts
    19

    Re: a:active not working in FIrefox or Netscape

    Quote Originally Posted by tjanson View Post
    Hi all. I would be much appreciative of your help on this. I have spent far too long trying to figure out why my a:active css is not working on the thumbnails below the large image when you click on one. Works fine in IE, Thanks so much for your input.

    Offending CSS:

    a.thumbnailuw:visited {
    display : block;
    border : 2px solid #000000;
    }

    a.thumbnailuw:hover {
    display : block;
    border : 2px solid #65ADE7;
    }

    a.thumbnailuw:active {
    display : block;
    border : 2px solid #65ADE7;
    }

    Site I'm applying it to:
    http://www.johntorrente.com/index.html
    I see a few things here.

    First is that your active color is the same as your hover color, so you would not see any color change.

    Second is the CSS coding itself. The way you have it set up will not work correctly even on my IE7 browser and it makes sense to me why it won't, due to your implementation of the css class.

    You have used your class in the code to effect only the a tag that has a class of thumbnailuw, but in your code you use the thumbnailuw class for the td tag.

    a.thumbnailuw:active means use thumbnailuw as a class of a and only on the :active part. (ie; <a class="thumbnailuw">)

    I think what you want is this:
    .thumbnailuw a:active which means to affect all the a:active areas within any tag with the thumbnailuw class.

    As a better and cleaner use of CSS, you could use the td itself to select what you want and eliminate the need for the class altogether, provided the only td tags you use on your page are for that effect(as on your linked page), you can also eliminate the need to even put the class="thumbnailuw" code on every td and clean up your code considerably.

    so your new code would look like this:
    Code:
    td a:visited {
    display : block;
    border : 2px solid #000000;
    }
    
    td a:hover {
    display : block;
    border : 2px solid #65ADE7;
    } 
    
    td a:active {
    display : block;
    border : 2px solid #65ADE7; /* change this to a contrasting color if you want */
    }
    OR

    If you use more than one table or set of td tags, add an id to the table itself.
    Then only all the enclosed tds in that table would be affected.
    Code:
    #thumbnailuw td a:visited {
    display : block;
    border : 2px solid #000000;
    }
    
    #thumbnailuw td a:hover {
    display : block;
    border : 2px solid #65ADE7;
    } 
    
    #thumbnailuw td a:active {
    display : block;
    border : 2px solid #65ADE7; /* change this to a contrasting color if you want */
    }
    There's a whole arguement about using CSS and DIVs instead of tables for layout, but I won't go into that here, but the same thing would apply to a div within a div, just replace td with div.

    Hope it helps!
    Last edited by markei; 03-16-2009 at 11:11 AM.



Tags for this Thread