hi all

i am new to CSS, i got some CSS code for tab menu. its fine but when i

select a menu item its color is not changing. can any one help regarding this.

here i am giving the code as well. thanks in advance.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script>
function setcolor(x)
{
document.xxform.getElementByID(x).style.display="DISPLAY: none";
}

</script>

<style type="text/css">
<!--
body {
margin:0;
padding:0;
font: bold 11px/1.5em Verdana;
}



img {
border: none;
}

/*- Menu Tabs 1--------------------------- */


#tabs1 {
float:left;
width:100%;
height:100%;
background:#FFFFFF;
font-size:93%;
line-height:normal;
border-bottom:1px solid #BCD2E6;
}
#tabs1 ul {
margin:0;
padding:3.5% 2% 0% 4%;
list-style:none;
}
#tabs1 li {
display:inline;
margin:0;
padding:0;
}
#tabs1 span {
float:left;
display:block;
padding:5px 15px 4px 6px;
color:#FFFFFF;
}
#tabs1 a {
float:left;
background:url("image/tableft10.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
color:FFFFFF;
}
#tabs1 a span {
float:left;
display:block;
background:url("image/tabright10.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:FFFFFF;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs1 a span {float:none;}
/* End IE5-Mac hack */
#tabs a:hover span {
color:3399CC;
}
#tabs1 a:hover {
background-position:0% -42px;
}
#tabs1 a:hover span {
background-position:100% -42px;
}

#tabs1 #current a {
background-position:0% -42px;
}
#tabs1 #current a span {
background-position:100% -42px;
}
-->
</style>


</head>

<body>
<div id="tabs1">
<ul>
<li><span></span></li><li><span></span></li>
<li id="current"><a href="home.htm" target="bottom" ><span>Home</span></a></li>
<li><a href="menu1.jsp" target="bottom"><span>Human Resource</span></a></li>
<li><a href="menu2new.jsp" target="bottom"><span>Revenue</span></a></li>
<li><a href="oppnew.jsp" target="bottom"><span>Opportunities</span></a></li>
<li><a href="menu3new.jsp" target="bottom"><span>Upload</span></a></li>
<li><a href="val1.jsp" target="bottom"><span>SetUp</span></a></li>
<li><a href="menu4new.jsp" target="bottom"><span>Dash Board</span></a></li>
</ul>
</div>
</body>
</html>

thanks
Ashok