Re: Help with CSS Menu States

[wolfcry911]

As Paulie mentioned, there are a few ways to do this. You’re using a server side scripting language (PHP) so that’s one way – you could use PHP to add a class to the menu item based on url.

Paulie’s method works well too, so I’ll try to explain it better.

put a class on each of your menu items (like .home, .contact, .about). Then for each page (or section) of the site put a similar id or class on the body – so the home page would have an id of home on the body element and the contact page would have an id of contact on the body, and let’s say there’s an about page and a sub about page, each would have an id of about on the body. Then, set your css up like this:

#home .home,
#contact .contact,
#about .about {
styling for active menu item }

so that when the .home classed menu item is a child of the #home id (which only occurs on the homepage) it gets the active menu item styling; or when the .about classed menu item is a child of the #about id (on either of the two about pages) then it gets the active menu styling…