Jump to content
jnop2001

custom primary nav bar

Recommended Posts

jnop2001

Hi

 

how can i change the color of dropdown-menu.a:hover

 

I try debbuging but i dont understand the pageline design files.

 

Please see the file atached.

 

many thanks

Share this post


Link to post
Share on other sites
Rob

Hi,

 

There's a premium section called Crackbar in our store: http://www.pagelines.com/store/sections/crackbar/ 

 

This will allow you to customize the settings for the NavBar using settings, including hover color.

 

The alternative is customized CSS code.


Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
jnop2001

good morning

 

i was expecting other answer.

 

which class/id i use to modify css code (changing the color of dropdown-menu.a:hover)? i try.nav ul li a without any sucess!

 

best regards

Share this post


Link to post
Share on other sites
Danny

HI,

 

I recommend you install Google Chrome, if you don't use it already and then load up the Web dev tool, inspect your navbar drop down menu and then click the:

 

http://screencast.com/t/w4kyPiBF4

 

http://screencast.com/t/TjFL1sApdwll

 

This is will then display the navbar dropdown menu item hover state, you can then view the code that it uses to apply the style. Which you can use to change the style, when adding your custom code, you may need to use one of the pagelines overrides such as #site or #page.

 

For example,

 

 

.dropdown-menu li > a:hover, .dropdown-menu li > a:focus, .dropdown-submenu:hover > a, .dropdown-menu li.current-menu-item > a { } 

If you add the PageLines override, the code will look something like this:

 

 

 

#site .dropdown-menu li > a:hover, #site .dropdown-menu li > a:focus, #site .dropdown-submenu:hover > a, #site .dropdown-menu li.current-menu-item > a { }
  • Like 1

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
jnop2001

perfect in firefox but not ok in chrome (still blue)

 

i am using: 

#site .dropdown-menu li > a:hover, #site .dropdown-menu li > a:focus, #site .dropdown-submenu:hover > a, #site .dropdown-menu li.current-menu-item > a {
text-decoration: none;
color: rgb(255, 255, 255);
background-color: rgba(158, 171, 5, 0.9);
background-image: -moz-linear-gradient(center top , rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.9));
background-repeat: repeat-x;}

 

 

Share this post


Link to post
Share on other sites
Danny

Thats due to you only use the gradient code for Mozilla FireFox, you need to add the gradient CSS for all browsers.

 

See this site for assistance - http://www.colorzilla.com/gradient-editor/

  • Like 1

Please search our forums, before posting!

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


×