1. PROMO Subscribe our All Access Pass @ 75% OFF & access all our 16+ premium Divi extensions: Divi Block Pro, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
NEW Divi.Help Pro Carousel AI Toolkit - Magically turn your Divi design into carousel, simply by using our online toolkit. No plugins needed. Now it works with Divi 5 as well!Try our carousel AI toolkit
BEST Divi Block - A revolutionary drag & drop tool to easily mix & match 960+ premade blocks (Light & Dark) to kick start your Divi site design. Special module designs are included as well. Also newly added AI generator & color. Now it works with Divi 5 as well!
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Solved Change Menu Text Hover Color

Discussion in 'Free Divi Community Forum' started by Marcus Phillips, Jan 14, 2019.

  1. Marcus Phillips

    Marcus Phillips New Member

    Hello,

    I've been trying to change the hover color of one of my menus that I've set up as a sidebar menu.
    When you hover over one of the links the text changes the color as my background. I tried looking around but I've only been able to find fixes for the changing the primary, secondary, or footer menu. I'm sure this is an easy fix....but everything I've tried hasn't worked.
    Any help is greatly appreciated! Thanks

    Link to page: intermusicsf.org/mgp
    (the menu on the lower left side)
     
    #1 Marcus Phillips, Jan 14, 2019
    1. PRO MEMBER PERKS Divi.Help Pro Layout Packs - Agency Divi layout pack featuring modern overlay archive blog layout with hover effects:View Demo
  2. Divi.Help

    Divi.Help Administrator
    Staff Member

    Try this CSS in Divi > Theme Options > Custom CSS:
    Code:
    Log In or Sign Up to view this code.
     
    #2 Divi.Help, Jan 14, 2019
    jrolloos likes this.
  3. adisa

    adisa New Member

    i've been on the same problem and this method can solved it. thanks!
     
    #3 adisa, Jun 24, 2019
    1. PRO MEMBER PERKS Divi Ultimate Footer Plugin - Custom global Divi footer (20 premade styles) + Revealing footer effect:Learn More
  4. paul whitehead

    paul whitehead New Member

    This option isn't possible inside the DIVI builder?
     
    #4 paul whitehead, Nov 23, 2019
  5. Divi.Help

    Divi.Help Administrator
    Staff Member

    Don't think you can do that in Divi Builder.
     
    #5 Divi.Help, Nov 23, 2019
    1. PRO MEMBER PERKS Divi Block Pro - Premade before / after image slider for your Divi site without using any plugins:View Demo
  6. paul whitehead

    paul whitehead New Member

    Whats strange is, I set a class name to my menu. I'm using .class a:hover{ color:#code; } and it's not working. Any tips? I'm using a menu module with a custom class name.
     
    #6 paul whitehead, Nov 23, 2019
  7. Divi.Help

    Divi.Help Administrator
    Staff Member

    What about adding !important tag? For example, .class a:hover{ color:#code!important; }
     
    #7 Divi.Help, Nov 23, 2019
    1. PRO MEMBER PERKS Divi Block Pro - 30+ premade custom footer designs for you to choose from:View Demo
  8. paul whitehead

    paul whitehead New Member

    So looking at the CSS for the menu, it has an ID of menu-pw-links and a class of "et-menu nav". shouldn't the et-menu nav be what I called the module? it works if i use #menu-pw-links a:hover { color:#fff000 !important; }. I'm confused as to why I'm not seeing that class how up after i name it.
     
    #8 paul whitehead, Nov 23, 2019
  9. paul whitehead

    paul whitehead New Member

    I guess the et-menu nav class is there by default and all of the styling is done by the menu name id? Even though i set a class to the module, it looks like everything is done using the menu name id.
     

    Attached Files:

    #9 paul whitehead, Nov 24, 2019
    1. PRO MEMBER PERKS Divi.Help One-Page Layouts - Beautifully crafted one-page Divi layouts just for you:View All Layouts
  10. Divi.Help

    Divi.Help Administrator
    Staff Member

    If you set a class to the module, it will be added inline with the et_pb_module div.
     
    #10 Divi.Help, Nov 24, 2019
  11. paul whitehead

    paul whitehead New Member

    so in order to change the menu links, the css is added for the menu id name and not the module css class i set? it sure looks this way..
     
    #11 paul whitehead, Nov 24, 2019
    1. PRO MEMBER PERKS Divi Block Pro - Premade mega menu design for your Divi site without using any plugins:View Demo
  12. Divi.Help

    Divi.Help Administrator
    Staff Member

    Perhaps it's because you added it as CSS ID, not CSS Class.
     
    #12 Divi.Help, Nov 24, 2019
  13. paul whitehead

    paul whitehead New Member

    it looks like it only works if i set the module name in the ID field & not the class.
     
    #13 paul whitehead, Nov 24, 2019
    1. PRO MEMBER PERKS Divi.Help Pro Layout Packs - Modern & powerful Agency Divi layout pack, featuring team carousel, sliding menu, etc.View Demo
  14. paul whitehead

    paul whitehead New Member

    This is the only thing I can think of... When you set a menu name in the appearance>menu section, this name is classified as an ID? So setting a class name to the module doesn't do anything because the ID of the menu name is taking presidency? So by setting the module of an ID name rather than a class name, this seems to work. Is this the right logic?
     
    #14 paul whitehead, Nov 24, 2019
  15. Divi.Help

    Divi.Help Administrator
    Staff Member

    It depends on the current CSS code. Perhaps your menu CSS Class code has lower priority than the current one & that's why it's not taking effect. You will need to use browser inspect to find which CSS is overridden it.

    But if you're using CSS ID instead, it does have higher priority. Though, it still depends on the existing CSS structure.
     
    #15 Divi.Help, Nov 24, 2019
    1. PRO MEMBER PERKS Divi Ultimate Header Plugin - Add custom vertical navigation for your Divi site. Turns into slide in menu on mobile:Learn More
  16. paul whitehead

    paul whitehead New Member

    the customer header is built in the theme builder, could this have anything to do with it?
     
    #16 paul whitehead, Nov 24, 2019
  17. Divi.Help

    Divi.Help Administrator
    Staff Member

    Previously I mentioned that Divi Builder doesn't allow to change the sidebar / widget menu hover color, not the menu module hover color.

    For the menu module, you can certainly change the hover color:

    upload_2019-11-24_18-17-56.png
     
    #17 Divi.Help, Nov 24, 2019
    paul whitehead likes this.
    1. PRO MEMBER PERKS Divi Ultimate Header Plugin - Add custom vertical navigation for your Divi site. Turns into slide in menu on mobile:Learn More
  18. paul whitehead

    paul whitehead New Member

    Ahhhh HAAAA! Landmine! This is awesome, lol!
     
    #18 paul whitehead, Nov 24, 2019
  19. paul whitehead

    paul whitehead New Member

    THANK YOU! Not sure who you are, but you're the best for sticking this one out & helping me! Consider me a friend to this forum!
     
    #19 paul whitehead, Nov 24, 2019
    Divi.Help likes this.
    1. PRO MEMBER PERKS Divi Block Pro - Premade floating button design for your Divi site without using any plugins:View Demo
(You must log in or sign up to post here.)