Skip to:

Re: Admin Bar CSS — background color

Look through the rulesets for all instances where you see the background is stated as #333 these would need to change.

The reason the parent element retains an active state even though not being hovered is that scripting is used (classic suckerfish sfhover – used to provide hover on non anchor elements for IE <= 6) this adds a class of .sfhover to parent elements.

Around line ~117 there is a grouping of selectors, the ruleset adds a background to each of these selectors and it’s there you will need to make further mods – if necessary breaking apart the grouping if it’s not required that all those elements have the same background.

Ruleset looks like this:

#wp-admin-bar ul.main-nav li:hover, #wp-admin-bar ul.main-nav li.sfhover, #wp-admin-bar ul.main-nav li ul li.sfhover {
background-color: #333;

you can try adding a border but must be wary of the fact that dropdowns are very sensitive to position, the hover can be disrupted quite easily and moving from parent to child can loose focus, but try dropping this in your styles and have a play around:

#wp-admin-bar ul.main-nav ul {border:1px solid red;}

Skip to toolbar