Jump to content
Sign in to follow this  
dagreat8

Changing the rollover color on navigation

Recommended Posts

dagreat8    1
dagreat8

Hello, I need help changing the rollover color on my pagelines theme. I am not familiar with css. I figured there would be an easy way to customize the rollover since all the other color options seem to be available. Please help. Thank you.

Share this post


Link to post
Share on other sites
gormanit    0
gormanit

Fred, You can go into wordpress admin > PlatformPro > Custom Code and enter this in the CSS field .main_nav ul li:hover {background:red; color:white;}

Share this post


Link to post
Share on other sites
dagreat8    1
dagreat8

Awesome, thank you. I applied it and it helped it some areas but overall it's acting weird...I can't really explain it. This is the code I added: .main_nav ul li:hover {background:#0f4357; color:#279fd2;} To this website: www.frescoristorante.com however, you will see that the hover is still gray...the blue color I applied only shows up when I hover over very small and specific areas...any ideas?

Share this post


Link to post
Share on other sites
cmunns    16
cmunns

What if you added !important tag like so: `.main_nav ul li:hover {background:#0f4357!important; color:#279fd2!important;}` What does that change?

Share this post


Link to post
Share on other sites
dagreat8    1
dagreat8

Hi Adam, thank you for the reply. However it had no affect :/

Share this post


Link to post
Share on other sites
gormanit    0
gormanit

I think the selector was incorrect, try: .main-nav li:hover {background:#0f4357; color:#279fd2;}

Share this post


Link to post
Share on other sites
dagreat8    1
dagreat8

I am able to see it when I hover over the drop down menu and then hover over the thin dark separator lines...I don't know if that helps but thought I should mention it.

Share this post


Link to post
Share on other sites
gormanit    0
gormanit

What colors/look are you trying to achieve. Do you want the top level menu items to be the same look as the sub menu items on inactive and hover or do you want the sub items to be the same as the top level? If you can specify I can better help with the code

Share this post


Link to post
Share on other sites
gormanit    0
gormanit

Try: .main-nav li a:hover {background:#0f4357!important; color:#fff!important;}

Share this post


Link to post
Share on other sites
dagreat8    1
dagreat8

That worked! Thank you! What was it in the code that did it? What was the genius behind it?

Share this post


Link to post
Share on other sites
gormanit    0
gormanit

Two things. It needed to target the a element, not the li. And it needed the !important to trump the other rules.

Share this post


Link to post
Share on other sites
dagreat8    1
dagreat8

You are the man...thank you.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×