Changing a:hover Background Color

  • Resolved WentzellA

    (@wentzella)


    11 years, 6 months ago

    Hello,

    I am currently working on a site, and I am trying to change the a:hover background color for the links. I’m not sure where to access this, since their really isn’t anything about links in the Theme Options, is their another way? I know I could add CSS to fix this but I’m not exactly sure which CSS to add. I’m trying to generally change the color of the a:hover for the menu bars, a primary one and then one in the footer. Currently they are orange and I would like them to both if possible be different colors.

    Thank You!

Viewing 7 replies - 1 through 7 (of 7 total)

  • This is possible. Your primary color in the theme options controls most of the site hovers but if you want different colors send me a link so I can confirm each spot you are talking about.

    Kadence Themes

    Thread Starter WentzellA

    (@wentzella)

    Here is my site: https://margiethompsonart.com/

    I want to change the colors in the bottom page menu to the color of the top menu’s backgroud, and vice versa.

    Thank you for the help!

    Add this to your custom css in the theme options and tell me if it’s what you meant.

    #containerfooter .menu li a:hover {background: #afdbcf;}
#nav-main ul.sf-menu a:hover {background: #4a466d; color: #fff;}

    Kadence Themes

    Thread Starter WentzellA

    (@wentzella)

    Thank You! It’s working perfect now.

    jstewar1

    (@jstewar1)

    I have 2 issues I am trying to solve in the Virtue Theme:

    1. i am trying to change my hover option to display the color #0d74bd in my secondary menu

    2. i created a header image to be placed under my secondary menu. I then matched my secondary menu color with my Sitewide Banner image, but the color spans across the page from end to end, but the banner image doesn’t. Any advice on how to make one match the other in length, whether shorter or longer?

    any way to disable having to hover over my portfolio links for them to display?

    This works perfectly. Thanks. For secondary menu I used:
    #nav-second ul.sf-menu a:hover {background: #008AF4; color: #fff;}

    Howewer, is there a quick solution to permanently show active link background (current page)?

    Thanks,

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Changing a:hover Background Color’ is closed to new replies.