Page 2 of 2

Re: [Solved]Each menu item different background colour?

Posted: Sat Sep 08, 2012 5:41 pm
by uniqu3
correct, and then use css accordingly.

Re: [Solved]Each menu item different background colour?

Posted: Sat Sep 08, 2012 10:15 pm
by Dr.CSS
Yes, and you don't need the menu- part if you don't want it...

Re: [Solved]Each menu item different background colour?

Posted: Sat Sep 08, 2012 10:48 pm
by twwitt
Great. Thanks. It's working now, except for when the parent menu item has no child (e.g. just a single main page on the first level). Then, the color only shows when I hover over it. What am I missing here that would display a background color when there's a parent and children, but NOT when it's just a lone page?

#primary-nav .menu-about a
{background: #589a3e;}

#primary-nav li.menu-about li a
{color: #ffffff;}

#primary-nav .menu-about:hover
{background: #589a3e;}

Re: [Solved]Each menu item different background colour?

Posted: Mon Sep 10, 2012 3:43 pm
by twwitt
I added back in: <a class='alias'> (in addition to <li class='alias'> and that allowed me to change the background for the menu item that didn't have any children. Hope this makes sense as a way to do it! Thanks for all your help.

Re: [Solved]Each menu item different background colour?

Posted: Mon Sep 10, 2012 8:00 pm
by Dr.CSS
May I suggest some reading..?

http://www.w3schools.com/css/default.asp

Re: [Solved]Each menu item different background colour?

Posted: Mon Sep 10, 2012 8:39 pm
by twwitt
Thanks. I'll try doing that again. I generally can make my way around many CSS, but I find menus to be extremely confusing (unlike other parts of CSS) in terms of what effects what. I haven't found http://www.w3schools.com/css/default.asp particularly helpful in that regard. But I'll try again so I don't have to be bugging you folks..

Re: [Solved]Each menu item different background colour?

Posted: Mon Sep 10, 2012 8:42 pm
by Dr.CSS
The style you use on the parent should trickle down to the children, hence "cascading style sheet"...

#primary-nav li.parent class a {bakground-color: }