Style child element when hover on parent

Question

How to change the style of child element when there is hover on parent element  I would prefer a CSS solution for this if possible  Is there any solution possible through  hover CSS selectors  Actually I need to change color of options bar inside a panel when there is an hover on the panel   Looking to support all major browsers

User · Accepted Answer

Yes  you can definitely do this  Just use something like   parent hover  child                    According to this page it s supported by all major browsers

User · Answer

you can use this too  x000D   x000D   parent hover                    x000D   x000D   x000D

User · Answer

Yes  you can do this use this below code it may help you       x000D   x000D   parentDiv  x000D  margin   25px  x000D   x000D    x000D   parentDiv span  x000D    display   block  x000D    padding   10px  x000D    text-align   center  x000D    border  5px solid  000  x000D    margin   5px  x000D    x000D   x000D   parentDiv div  x000D  padding 30px  x000D  border  10px solid green  x000D  display   inline-block  x000D  align   cente  x000D    x000D   x000D   parentDiv hover  x000D    cursor  pointer  x000D    x000D   x000D   parentDiv hover  childDiv1  x000D  border  10px solid red  x000D    x000D   x000D   parentDiv hover  childDiv2  x000D  border  10px solid yellow  x000D     x000D   parentDiv hover  childDiv3  x000D  border  10px solid orange  x000D    x000D   lt div class  parentDiv  gt  x000D   lt span gt Hover me to change Child Div colors lt  span gt  x000D     lt div class  childDiv1  gt  x000D      First Div Child x000D     lt  div gt  x000D     lt div class  childDiv2  gt  x000D      Second Div Child x000D     lt  div gt  x000D     lt div class  childDiv3  gt  x000D      Third Div Child x000D     lt  div gt  x000D     lt div class  childDiv4  gt  x000D      Fourth Div Child x000D     lt  div gt  x000D   lt  div gt  x000D   x000D   x000D

[css] Style child element when hover on parent

Examples related to css

Examples related to css-selectors