What is the correct CSS notation for this?

I have a menu. Each menu item has the class .menu_item

Now, I want to set the styles for the links that are the menu items. Surely I do this:

.menu_item a:active {}

..because this works:

#sidemenu p {}

which I apply to all p tags in the sidemenu.

However the link styles do not work. I am applying them in the following order:


.menu_item {
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
text-align: left;
margin: 0px 0px 4px 0px;
padding: 4px;
width: 100%;
background-color: #FFFFFF;
border: 0px none;
}
.menu_item a:link {
text-decoration: none;
}
.menu_item a:visited {
text-decoration: none;
color: #333333;
}
.menu_item a:hover {
text-decoration: none;
background-color: #F6F6F6;
border: 1px solid #CCCCCC;
}
.menu_item a:active {
text-decoration: none;
color: #330099;
}


And an example menu item is this:

<a class="menu_item" href="#">MAIN MENU</a>

...so, why doesn;t it work? :confused:

::] krycek [::

try just
.menu_item:hover {

drop the "a" on each one.

DAMN!

...it works now. TO think it was that simple! :rolleyes:

Thanks goose! :D

::] krycek [::