Following because I would like to do this too!
Something like this:
#nav-header .nav li a { color: #ccc; }
#nav-header .nav li > a:hover,
#nav-header .nav li:hover > a,
#nav-header .nav li.current_page_item > a,
#nav-header .nav li.current-menu-item > a,
#nav-header .nav li.current-menu-ancestor > a,
#nav-header .nav li.current-post-parent > a { color: #fff; }
Or, for the topbar, replace #nav-header with #nav-topbar.
So I just put this code into Custom CSS, changing the two color #s?
(sorry, just getting used to CSS for the first time!)
This works great. Something else, how do you change the height of each nav bar? i would like to make #nav-topbar 35px. There also seems to be a 3/4 grey border on the main nav menu and it would be great to remove that to blend with the header color other than black/drk. grey.
side note:
Caftulate: just copy/paste the code in your custom.css.
you can use the wordpress user interface to do this. APPEARANCE->EDITOR->custom.css (on right list at bottom).
also, how do you complete the header border. so there is a bottom border.
OK I have just tried putting that code into custom css. I have tried changing the color codes on both the bottom and top lines of the code (all I want is black nav bar text) but it doesn’t make any changes.
Any help appreciated, thanks!
Did anyone figure this out, because this is on my list too. I just want to get rid of that thin border, and change the nav color, but when I add it to my custom CSS, nothing changes. Dying to know!!
To change nav colors, go to your dashboard > Appearance > Theme Options > Styling > Topbar Background or Header Background.
Just replace the colors there with your color of choice like #F00
If there’s anybody who would want to add the Search bar to the header,
just add the following codes inside the <header><nav> Add there </nav></header>
<div class=”container”>
<div class=”container-inner”>
<div class=”toggle-search”><i class=”fa fa-search”></i></div>
<div class=”search-expand”>
<div class=”search-expand-inner”>
<?php get_search_form(); ?>
</div>
</div>
</div><!–/.container-inner–>
</div><!–/.container–>
/////
i add another php code (qtranslate) in the header nav inside a div class=”toggle-search”
it works but when i click it, the search div in the top nav opens at the same time
how can i fix it?