Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    New to the CF scene
    Join Date
    Nov 2002
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    CSS & Mozilla - .hover not working

    I am designing a simple webpage. I am using the following CSS styling:

    a.3dmenu {
    color: #0000FF;
    font-family: Verdana;
    text-decoration: none;
    font-size: 11px;
    font-weight: bold;
    font-variant: normal;
    }


    a.3dmenu:visited {
    color: #000099;
    }


    a.3dmenu:hover {
    color: #FF0000;
    background-color: #FFFFFF;
    text-decoration: none;
    }


    a.3dmenu:active {
    color: #FF0000;
    }


    This works perfectly for IE. (When the user moves the mouse over a .3dmenu link, it goes red, rather than being underlined, and changes colour once it has been visited).

    However, on Mozilla 1.2.1 this doesn't work at all. The items tagged with the CSS style .3dmenu just appear in a bog standard font. (Times New Roman I think)

    Does anyone know why this happens and what I can do to rectify this problem?

    Best wishes and thanks for reading this
    Steve/Cryton

  • #2
    Regular Coder
    Join Date
    Oct 2002
    Posts
    380
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Is your link in a table?

  • #3
    New to the CF scene
    Join Date
    Nov 2002
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yes the links are in a table.

  • #4
    Regular Coder
    Join Date
    Jun 2002
    Location
    Iowa / Notre Dame
    Posts
    538
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Maybe it's just me, and maybe I do it the wrong way, but I almost never put an "a" infront of my CSS. For example, instead of this:

    a.3dmenu:hover

    I just have:

    .3dmenu:hover

    It always seems to work for me in both IE and Mozilla. I don't know why it would make a difference but maybe you should give it a try?
    My Site {Mike's Adventures}

    Yikes, forums are almost too much fun.

  • #5
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts
    I don't believe classes can begin with a number.

  • #6
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts
    Originally posted by pardicity3
    Maybe it's just me, and maybe I do it the wrong way, but I almost never put an "a" infront of my CSS.
    tag.myclass is a syntactic shorcut for:
    tag[class~=myclass].
    This is only valid for HTML too - with any other XML markup, you should use the full version.

    Therefore, a.myclass is more specific than .myclass because it only selects anchors that have that class applied, instead of all elements with that class. Perfectly valid.

  • #7
    Regular Coder
    Join Date
    Jun 2002
    Location
    Iowa / Notre Dame
    Posts
    538
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hah, forgot about that number thing!

    One question jkd, what if I want to apply the same styling to say a div as well as a table cell. If I were doing it I would just have one class and not specify a tag:

    .myclass {border: 1px #FFFFFF;}

    then I could just do <td class="myclass"></td> and <div class="myclass"></div> instead off adding more code that is basically just repetitve. Obviously it's not that big of a deal, but if you had a lot of instances like this it might save a great deal of file size.
    My Site {Mike's Adventures}

    Yikes, forums are almost too much fun.

  • #8
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts
    Originally posted by pardicity3
    Hah, forgot about that number thing!

    One question jkd, what if I want to apply the same styling to say a div as well as a table cell. If I were doing it I would just have one class and not specify a tag:
    .myclass

    is essentially:

    *[class~=myclass]

    So yeah, a class without a tag can be applied to any element.

    If you still wanted to be specific:

    div.myclass, table.myclass {
    /* bla */
    }

    Is still specific, but only one rule definition.

  • #9
    New to the CF scene
    Join Date
    Nov 2002
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Originally posted by jkd
    I don't believe classes can begin with a number.
    Big thumbs up, jkd! A mass find/replace and now it works beautifully in Mozilla. Thanks greatly!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •