- Home
- Categorie
- Coding e Sistemistica
- HTML e CSS
- Come applicare gli stili a tutti gli elementi figli al mouseover sull'elemento padre
-
Come applicare gli stili a tutti gli elementi figli al mouseover sull'elemento padre
esempio:
<div class="padre">
<div class="figlio">contenuto 1</div>
<div class="figlio">contenuto 2</div>
</div>.padre:hover{border:1px solid #000}
.figlio:hover{border:1px solid}in questo esempio vorrei che al mouseover sul div con classe padre scattasse un cambiamento di stile anche su tutti i figli, in modo da vedere 3 bordi e non solo il bordo del padre e quello del figlio in corrispondenza del puntatore del mouse.
Ho provato varie combinazioni ma non ne sono venuto a capo, forse non si può fare?
-
Non capisco bene per "3 bordi" cosa intendi.
-
i bordi sono gli stili contenuti nelle classi :hover dell'esempio (border:1px solid #000);
vorrei fossero applicati su tutti gli elementi figli, se il padre viene avvicinato dal mouse
-
Sulle vecchie versioni browser ( di IE specialmente) questo non funzionava poichè l'hover teoricamente sarebbe unicamente applicato ad un elemento "link" (quindi <a href="..... ).
Ammettendo comunque che oramai queste vecchie versioni sono divenute ostiche e sempre meno utilizzate ti basterebbe fare così:.padre:hover, .padre:hover *{ } ```Ciao facci sapere.
-
ho fatto un test su ie7 e ie8 in modalità compatibilità, ie9 e versioni recenti di firefox e chrome e sembra funzionare bene.
Ti ringrazio ...
ciao