Color for hovering links

[skitson]

I have a little problem, i have many links for my menu, and I have a css file that changes the background color when hovered over, is there any way to make them have different colors for each link i indicate. Right now i can only change all of them.
via

#menu a:hover {
background:transparent url(images/img28.gif) repeat-x scroll 0%; /*change background on mouse over*/
}

<div id="menu">
<ul id="main">
<li class="current_page_item"><a href="#">Homepage</a></li><!--change current_page_item when navigating different pages-->
<li><a href="#">Archive</a></li>
<li><a href="#">Blog</a></li>
<li><a href="Photo's.htm">Photos/music</a>
<li><a href="javascript:ts('page',-1)">+ Smaller Font</a></li><!--Change Page to any div to effect text size-->
<li><a href="javascript:ts('page',1)">+ Larger Font</a></li>
<li><a href="#">Videos</a>

</ul>

</div>

Heres the site

[delusion]

Originally Posted by skitson

I have a little problem, i have many links for my menu, and I have a css file that changes the background color when hovered over, is there any way to make them have different colors for each link i indicate. Right now i can only change all of them.
via
Heres the site

Make every <li> an ID, so
<li id="menu1"><a href="#">Archive</a></li>
<li id="menu2"><a href="#">Blog</a></li>
<li id="menu3"><a href="Photo's.htm">Photos/music</a>
<li id="menu4"><a href="javascript:ts('page',-1)">+ Smaller Font</a></li><!--Change Page to any div to effect text size-->

and in your CSS style your menu1, 2, 3 and 4..

I think

[skitson]

Thanks, that worked perfect. This had been bugging me for a while.