active / current menu

[seba]

Does anyone know how I can add an active status to a menu, I’ve put …
css…
#menu li a:hover {
color: #B5D5FF;
background: #FFF;
font-family:arial;
}

#menu li a:active {
color:#AB5667;
font-family:arial;
}

#menu li a:visited {
color:#FBC8B4;
background-color : #fff

html…
<div id="menu">
<ul>
<li></li>
<li><a href="gettingready.htm" target="_self">Getting ready </a></li>
<li><a href="gettingready2.htm" target="_self">2 </a></li>
<li><a href="happycouple.htm" target="_self">The happy couple </a></li>
<li><a href="happycouple2.htm" target="_self">2 </a></li>
<li id="active"><a href="ceremony.htm" target="_self" id="current">Ceremony</a></li>
<li><a href="ceremony2.htm" target="_self">2 </a></li>
<li><a href="celebrations.htm" target="_self">Celebrations <span></span> </a></li>
<li><a href="celebrations2.htm" target="_self">2 </a></li>
</ul>
</div>

The hover and visited both work fine but the active doesn’t work, only when I hold down on the link, any ideas anyone?
Cheers.

[Chris Coyier]

a:active (with a colon) is a pseudo-selector that indicates the link is currently being clicked on or has been "tabbed" to. In your code, your link item has a ID of current, so use that:

Code:

#menu li a#current {
color:#AB5667;
font-family:arial;
}

[seba]

Yeah I just figured it out, cheers!

[Author]

Posts