Jump to content
Sign in to follow this  
thebusysingleparent

Nav appearance - need help

Recommended Posts

thebusysingleparent

I really have no idea how this happened so I don't know how to repeat it. But if you look here http://thesingleparentperspective.com/ the nav row is green. But if you look here http://thesingleparentperspective.com/honors/ (sub blog) it is not. I have all the same settings in the design area and non of my custom css has anything to do with the nav_row First - I would like to know how to make it the same color as my background so I can repeat it on sub blogs. Second - how do I change the color when you are hovering? Same with the text - I can change the text color but how can I make the text color when hovered different? I do use chrome to inspect css but I just can't figure this out as I am new to css but try to figure it out as I go.

Share this post


Link to post
Share on other sites
catrina
CSS for changing the background color: [code]ul#menu-nav ul.main-nav li.page_item a {background-color: #xxxxxx;}[/code] CSS for changing the hover colors for the text and background: [code]ul#menu-nav ul.main-nav li.page_item a:hover {color: #xxxxxx; background-color: #xxxxxx;}[/code]

Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
thebusysingleparent
Thanks for the css code but how did it do it on the main site without any custom css but not the second site? I'd like to be able to figure this out so when I change the background color it will automatically change the nav color also. Any ideas?

Share this post


Link to post
Share on other sites
thebusysingleparent
Never mind - with what you gave me and some messin around I finally got it to look the way I wanted. Just one question - is there a way that when you hover over and the sub menu appears that it can have a different color test other than when each item is hovered over?

Share this post


Link to post
Share on other sites
catrina
[quote]Just one question - is there a way that when you hover over and the sub menu appears that it can have a different color test other than when each item is hovered over?[/quote] Yes, it is possible. I can't inspect the submenu and come up with the CSS if the submenu isn't in the navigation bar, however. Do you think you can create at least one?

Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
thebusysingleparent
I have sub menus on the main site http://thesingleparentperspective.com/ However, I went back and changed everything to default settings (started over) and used the css you gave me above - using my preferred colors and it did nothing. So now all I have done is took out all the css (for nav area) that I had and set the background colors in the design control section and am using [code]#nav_row.main_nav, ul.sf-menu ul li { background-color: #719980; }[/code] to extend the green area across the page (found that through trial and error). What I need to know is how to change the text colors and hovering colors without using the design control area that affects other areas of the site as well. Like when I changed the Page - Tertiary Text Color to white so it would show up better in the nav area my by line information disappeared into the page. And when I changed the hover colors it changed other areas I didn't want changed. I have experimented and can't seem to find the right css.

Share this post


Link to post
Share on other sites
Rob
I haven't tested this, but you could via CSS Rules: [code] .main_nav li a, #subnav_row li a, .main_nav ul.sf-menu a, .sf-menu a:visited { color: #FFFFFF; }[/code] It should turn text in the main nav and subnav to white. If it works, you can change the color to anything you please.

Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
thebusysingleparent
That did indeed work for changing the text.

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  

×