Hover State

  • whoooops

    #4112

    Hi, Just wondering if there is a way to use the hovers current state on my menu items at all times?

    Eg: instead of hovering over the menu item, could the color of the hover stay static on all buttons, and just the text turn a different color when you hover over them??

    Hope you understand what i mean ! 🙂

    Anonymous

    #27290

    Yep

    #header-menu > li > a {
    background: none repeat-x scroll left 0px #400000 !important;
    color: #000;

    }
    #header-menu ul li:hover, #header-menu ul li.current-menu-item, #header-menu ul li.current-menu-ancestor {
    background: none repeat-x scroll left 0px #400000 !important;
    color: #FFF;
    }

    Keep the background colors the same and the text color different for hover and non-hover state.

    whoooops

    #27291

    Hi Tee,

    thanks for the reply, But i cant seem to see any change,

    Here is the link to what i have at the moment!

    http://www.elliottwaveireland.com/blog/

    I would like all my menu items to be viewed the way the FAQ menu item appears. Just unsure of what code to get rid of in the style sheet…

    any advice appreciated 🙂

    Anonymous

    #27292

    Erase the previous code I gave you try this:

    #header-menu > li > a {
    background: none repeat-x scroll left 0 #396395 !important;
    color: #FFFFFF;

    #header-menu > li:hover > a, #header-menu > li.current-menu-item > a, #header-menu > li.current-menu-ancestor > a {
    background: none repeat-x scroll left 0 #396395 !important;
    color: #6EB0E1;
    }

    whoooops

    #27293

    Hi Tee,

    Thanks very much for the help, it worked, Happy out now!!! 🙂

    whoooops

    #27294

    I have just one more issue, The Blue bg of the contact and Faq Pages is running into one another, How can i separate these like the other menu items..Has it something got to do with the <span>? ??

    kenmcneill

    #27295

    You’ve made your menu float right instead of left, so you first is now your last. 😉 Try this –

    #header-menu > li:first-child {
    margin-left: 5px;
    }

    whoooops

    #27296

    Fantastic it worked, thanks a mill Kenmcneill, 🙂

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.
Do NOT follow this link or you will be banned from the site!