No puedo obtener un cambio de color en el CSS desplegable

I want to change the color of the menu once the user selects it. I want the Year,Class, Subject menu item to change to blue once the user rollover it and remain blue while the user navigate through its dropdown. im propbably doing something really stupid.

HTML

<nav id=global>
     <ul id="nav">

       <li>  <a href="index.html"><b>Home</b></a>

       </li>
                <li>  <a href="#">Subject</a>
            <ul>
                <li><a href="page2.html">test1</a></li>
                <li><a href="#" >test1</a></li>
                <li><a href="#" >test1</a></li>
                <li><a href="#" >test1</a></li>
                <li><a href="#" >test1</a></li>
                <li><a href="#" >test1</a></li>
            </ul>
        </li>

          <li><a href="#">CLASS</a>
            <ul>
                    <li><a href="#">test1</a></li>
                    <li><a href="#">test1</a></li>
                    <li><a href="#">test1</a></li>
                        <li><a href="#">test1</a></li>
                    <li><a href="#">test1</a></li>
                    <li><a href="#">test1 </a></li>
                    <li><a href="#">test1</a></li>
                    <li><a href="#">test1</a></li>
                     <li><a href="#">test1</a></li>
                    <li><a href="#">test1</a></li>
                <li><a href="#">test1</a></li>                    
                <li><a href="#">test1</a></li>
                    <li><a href="#">test1</a></li>
                    <li><a href="#">test1</a></li>
                <li><a href="#">test1</a></li>                    
                <li><a href="#">test1</a></li>
                    <li><a href="#">test1</a></li>
                    <li><a href="#">test1</a></li>
                <li><a href="#">test1</a></li>
                <li><a href="#">test1</a></li>
                    <li><a href="#">test1</a></li>
                    <li><a href="#">test1</a></li>
                <li><a href="#">Ptest1</a></li>
                    <li><a href="#">Shtest1</a></li>
                    <li><a href="#"> test1</a></li>
                    <li><a href="#">test1</a></li>
                    <li><a href="#"> test1</a></li>
                    <li><a href="#">test1 test1 test1</a></li>
                  <li><a href="#">  test1</a></li>
                <li><a href="#">test1</a></li>                    
                <li><a href="#">test1</a></li>
                    <li><a href="#">test1</a></li>


            </ul>
       </li>
         <li><a href="#" >Year</a>

                <ul>
                    <li><a href="#">David Hodd</a></li>
                    <li><a href="#">David Hodd</a></li>
                    <li><a href="#">David Hodd</a></li>
        <li><a href="#">David Hodd</a></li>
        <li><a href="#">David Hodd</a></li>
        <li><a href="#">David Hodd</a></li>
         <li><a href="#">David Hodd</a></li>
        <li><a href="#">David Hodd</a></li>
        <li><a href="#">David Hodd</a></li>
        <li><a href="#">David Hodd</a></li>
        <li><a href="#">David Hodd</a></li>

                </ul>
       </li>


      </ul>
    </nav>

CO

#nav { 
font-size:14px; 
color:#fff;
margin:2px; 
padding:0px; 
position:absolute; 
top:8px;
left:25px;
font-weight:bold;
z-index:400;

}
#nav a.active {
    color:#000;
}

#nav > li {
 font-weight:normal;
list-style-type:none; 
float:left; 
display:block; 
margin:0px 0px;
color:#000;
position:relative; 
padding:10px; 
width:190px;

}
#nav > li:hover ul {
 display:block; 
color:#000;
 }
#nav > li:hover  { 
background-color:#fff;
-moz-border-radius:10px; 
-webkit-border-radius:10px;
border-radius:10px; 
color:#000;
-moz-box-shadow:0 1px 1px #777;
-webkit-box-shadow:0 1px 1px #777;
box-shadow:0 1px 1px #777;
color:#000;
}

#nav li ul {
font-size:11px;
 margin:0px; 
padding:0px; 
display:none;
color:#000;}

#nav li ul li {
font-size:10px; 
list-style-type:
none; 
margin:0px 0 0 0;
color:#000;
}
#nav li ul li a { 

font-size:10px;
display:block; 
padding:5px 10px; 
color:#000; 
text-decoration:none;
}

#nav li ul li:hover a { background-color:#ccc; 
-moz-border-radius:5px;
 -webkit-border-radius:5px;
border-radius:5px;
}
#nav li span { 
cursor:pointer;
margin:0px 10px;
color:#000; 
}

preguntado el 31 de enero de 12 a las 08:01

Probably browser mismatch.. Maybe u shud consider using javascript.. -

1 Respuestas

You haven't defined "a:active" anywhere. Try adding that in.

Respondido el 31 de enero de 12 a las 19:01

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.