Ciao a tutti

avrei dei dubbi riguardanti i css 3.0
allora io ho un div esterno chiamato "news" dentro il quale ci sono una immagine , un altro div piccolo e un altro div piccolo ancora

se sui css scrivo news :hover e modifico il background-color me lo modifica agli elementi interni ma non al div piu grande.

ho risolto ponendo un altro DIV piu grande chiamandolo TEST, applicando su questo gli stessi css di prima la cosa funziona, ma voglio capire bene dove sta l'errore


naturalmente questo problema si ripercuote con il transation, applicando il transation al box news mi viene che se passo il mouse su i div piu piccoli si vede prima un cambio di sfondo nel rettangolino e poi sul box piu grande

allego i css:


.test
{
cursorointer;
margin-top:30px;
border: none;
overflow:auto;
width:600px;
box-shadow:0px 0px 30px #000000;
-webkit-box-shadow:0px 0px 30px #000000;
-moz-box-shadow:0px 0px 30px #000000;
-webkit-border-radius:5px 5px;
-moz-border-radius:5px 5px;
border-radius:5px 5px;
background-color:white;
transition-property: background-color; /*safari*/
transition-duration: 2s;
-webkit-transition-property: background-color; /*safari*/
-webkit-transition-duration: 2s;
-o-transition-property: background-color; /*opera*/
-o-transition-duration: 2s;
-moz-transition-property: background-color; /*firefox*/
-moz-transition-duration: 2s;
}
.test :hover
{
background-color: #C6C;
}
.news
{
transition-property: background-color; /*safari*/
transition-duration: 1.5s;
-webkit-transition-property: background-color; /*safari*/
-webkit-transition-duration: 1.5s;
-o-transition-property: background-color; /*opera*/
-o-transition-duration: 1.5s;
-moz-transition-property: background-color; /*firefox*/
-moz-transition-duration: 1.5s;
width:600px;
height:100px;
}