ThemeShaper Forums » Thematic


a:focus CSS menu help

(6 posts)
  • Started 9 years ago by jhkoning
  • Latest reply from seanhawkridge
  • This topic is not resolved
  1. jhkoning

    Hi again,
    I'd like to be able to control the color of the top level menu item when hovering over a sub menu item (a:link).
    I'd like the link to remain #FFF; but it currently defaults to #666; and has something to with a:focus (which is beyond me)...
    Thanks in advance,

    Posted 9 years ago #
  2. jhkoning

    Surely someone can help me with this? It's been a week...

    Posted 9 years ago #
  3. sowingseeds

    Check the Thematic menus demystified in the sticky section. #6. Styling the Beast should give you the help you need. If not there shout again!!

    Posted 9 years ago #
  4. jhkoning

    Thanks @sowingseeds - I'll check it out & report back

    Posted 9 years ago #
  5. jhkoning

    Sorry @sowingseeds I've tried & failed.
    Here are a couple of images that illustrate what I'm trying to achieve.
    Ok, image 1 illustrates that the link colour 'STUDENT INFORMATION' is white when you hover over it. As you can see to the right, 'APPLY' is grey, which is it's natural state.
    So, image 2 you notice the parent or ancestor (in this case 'STUDENT INFORMATION') reverts back to grey when you are hovering over the sub-menu.
    I want 'STUDENT INFORMATION' to remain white.
    How do I target the correct class and/or how do I track it down?
    Many thanks!

    Posted 9 years ago #
  6. seanhawkridge

    I just had a play around with this:

    .sf-menu li.sfHover a:hover {
    color: #fff;

    And it's getting there. I can get it to the stage where it keeps the hover color for the parent items but reverses the colors for the sub-menu items. But I reckon if you play around you might get what you need.

    Posted 9 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.