Jump to content
Sign in to follow this  
Gavin_

Background hover color and image alignment with Navigation

Recommended Posts

Gavin_

Hi 2 questions that i need help with... 1st one I am trying to get rid of the grey hover color that appears in the navigation. I searched the forum here and cobbled this together

.main-nav li a:hover {
	    background: transparent !important;
	    color: #16692B !important;
	}
I also tried
.main-nav li a:hover {
	    background-color: transparent !important;
	    color: #16692B !important;
	}

It changes the text color on hover but doesn't remove the grey color, any ideas? 2nd I am using a background image for the navigation and want the text to start further to the right of the image... all help will be greatly appreciated. thanks

Share this post


Link to post
Share on other sites
mackenzie
Have you looked at the CSS Lite plugin Jenny created? I think this would help eliminate some of the CSS you are looking for. http://www.pagelines.com/store/plugins/simple-css-lite/

Mackenzie - PageLines Help Desk

The Centsible Family - Writer, Photographer and Coffee Addict

---------------------------------------------------

Kindly search this forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

Share this post


Link to post
Share on other sites
Gavin_
Yes, I had looked at the plugin and it does not appear to give you the option to have transparent and neither does it appear to help you with alignment. thanks any way

Share this post


Link to post
Share on other sites
Gavin_
OK I have solved one of the problems here is what i have done . [code].main-nav li a:hover, .main-nav .current-menu-ancestor .current_page_item a:hover, .main-nav li.current-menu-ancestor ul a:hover { color: #16692B !important; } .main_nav li:hover { background-color: transparent; }[/code] i would really appreciate some help with the layout of the text though... thanks

Share this post


Link to post
Share on other sites
Danny
Hi Gavin, Try adding this and replacing the code you already have to display the navigation image. [code]#brandnav .brandnav-nav {float: right;margin-left: 20px;width: 520px;background: url(http://www.dig-for-community.co.uk/wp-content/uploads/2012/03/nav_bground.png);} #menu-nav {width: 480px;float: right;text-align: right;}[/code] Also, if you add more items to the navigation, you will need to adjust the width accordingly.

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
Gavin_
Thank you Danny

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  

×