• Resolved ameey

    (@ameey)


    I have a problem trying to make the background color of the menu (mainly the hover menu) to be transparent. I’ve already tried going to Theme Options, Colors and leaving the color blank but it doesn’t work.

    TIA

Viewing 10 replies - 16 through 25 (of 25 total)
  • Hey again shandycreative,

    I absolutely do not think that, we just had a miscommunication since the code I provided is changing the background hover color instead of text hover color. So in that case please try adding the following as instructed above.

    .site-header .main-navigation ul li a {
    background: none repeat scroll 0 0 #B3D9A8;
    color: #3a316d;
    }
    
    .site-header .main-navigation ul li.current_page_item a, .site-header .main-navigation a:hover {
    color: #F68C28;
    }

    This should do the trick.

    Hope this helps ??

    Best regards,
    Bojan

    shandycreative

    (@shandycreative)

    Sorry….I put that code in and just changed the text color from the blue to the orange. When I hover, nothing happens.

    Hey again,

    As I previously mentioned in one of my posts it seems that you have a lot of code added there which are affecting your navigation style. Please remove all the code from the custom CSS tab, if that is the place where you’re adding the code, which is related to the navigation.

    I’ve tested this multiple times in my installation with only code posted in my previous response and this is the result https://screencast.com/t/Wyjr74C0Mol.

    Best regards,
    Bojan

    shandycreative

    (@shandycreative)

    Wow.

    I just changed all the “colors” in the theme options back to the default and the only code I have in the custom css is the code you gave me. Thought that would fix it, but it didn’t. ??

    Hey again,

    This is not what I’ve said. I’ve said you should remove the code which is affecting the navigation from Appearance >> Theme Options >> Custom CSS.

    Could you please post code from there so I can try to help you out clearing that.

    Best regards,
    Bojan

    shandycreative

    (@shandycreative)

    This is all the code I have in the custom css area:

    .site-header .main-navigation ul li a {
    background: none repeat scroll 0 0 #B3D9A8;
    color: #3a316d;
    }

    .site-header .main-navigation ul li.current_page_item a, .site-header .main-navigation a:hover {
    color: #F68C28;
    }

    Hey shandycreative,

    After closer inspection I’ve realized that the reason for this is your menu item links are actually not linking anywhere which is causing them to get current_page_item class which has orange text color.

    Please create respective pages for those links and the code will work properly.

    Hope this helps ??

    Best regards,
    Bojan

    shandycreative

    (@shandycreative)

    That did it!

    Thanks

    Glad I could help ?? Have a great day!

    Cheers,
    Bojan

    shandycreative

    (@shandycreative)

    Thanks…you too!

Viewing 10 replies - 16 through 25 (of 25 total)
  • The topic ‘main menu background color’ is closed to new replies.