Style child element when hover on parent

Issue

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.

Solution

Yes, you can definitely do this. Just use something like

.parent:hover .child {
   /* ... */
}

According to this page it’s supported by all major browsers.

Answered By – jtbandes

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published