Código HTML:
Ver original
<g class="menu1"> <rect class="r1" id="r1" y="194.1px" x="370.6"/> <g class="Azul1"> <rect class="azul" id="azul1" x="370.6px" y="227.3" height="-10" width="151.9" /> <g class="Verde1"> <rect id="verde1" class="verde1" y="227.4" x="523.5" height="-10" width="151.9" /> </g> </g> </g>
si yo le pongo en css la intruccion
.menu1:hover #azul1 {height:32.07px;}
Entonces azul1 se visualiza, esto me esta dando a entender que la <rect azul1> es hijo de <g menu1>, esto puedo llegar a entenderlo.
ahora bien si yo le digo:
#azul1:hover ~ #verde1 {height:32.07px;}
esto no funciona, creia que eran hermanos, pero parece ser que no lo son.
Claro si yo hago:
.Azul1:hover .verde1 {height:32.07px;}
funciona y Azul1 es el padre de .verde1
Entonces si Azul1 es el padre de #azul1 y de .verde1, porque #azul1 y .verde1 no son hermanos? esto es algo que no comprendo bien, que es lo que esta pasando?
Espero haberme explicado bien gracias :)