Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • June 14, 2016 at 6:37 am #647799
    spleeky

    I can change this in the theme settings, but i want to add it to my child theme, so i can easily re-use etc.

    I can’t figure this out I’ve tried a tonne of different possibilities from searching the forums.

    What do i add to my child themes, style.css to change the font colour of the main menu, when it is hovered over?

    Thanks

    June 14, 2016 at 6:56 am #647801
    spleeky

    I think i’ve made some progress , i have this code in my child style sheet

    #avia-menu .avia-menu-text {
    font-size: 12px ;
	color: red   ; 
}

#top .main_menu .menu li a:hover { background-color: #6ab2b5; color: white !important; }

    The first bit of code, changes the font size of the menu item, and changes the colour of the text.
    The second bit of code changes the styling for the menu item when it’s hovered.

    I’ve discovered if i take the color statement out of the first bit of code so have this instead

    #avia-menu .avia-menu-text {
    font-size: 12px ;
	}

#top .main_menu .menu li a:hover { background-color: #6ab2b5; color: white !important; }

    Now the font colour changes as desired when it’s hovered over.
    So the first colour statement seems to be applying to hover and normal state.

    How do i fix this?

    thanks

    • This reply was modified 8 years, 5 months ago by spleeky.
    June 14, 2016 at 7:00 am #647805
    spleeky

    Finally fixed it. 

    #top .main_menu a {
color: red ;
}

#top .main_menu .menu li a:hover { background-color: #6ab2b5; color: white ; }

    did the trick

    June 15, 2016 at 5:39 am #648380
    Rikard

    Hi,

    Great, glad you got it working and thanks for sharing your solution. You can also change that under Enfold–>Advanced Styling.

    Thanks,
    Rikard

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.