/CSS/If child elemnt is hovered do changes to the container css

If child elemnt is hovered do changes to the container css

CSS can not select a parent div only when a specific child or descendent element is hovered.  You'll need some JavaScript to achieve what you seem to want.

JavaScript can be added to add something like a "hovered" class to your parent element when various mouse or touch events happen on the child div.  You could edit the CSS properties directly in JavaScript but I would use a CSS class just to keep more of the CSS concerns separate.



The :hover is closely related to your question but it doesn't solve your requirements.  :hover lets you select elements that are hovered over.  If the child is hovered, the parent is also hovered.  There is a problem though.
Here is an example of the problem with :hover:
HTML:
<div class="my-parent">
   <button id="ok">OK</button>
   <button id="cancel">Cancel</button>
</div>

CSS:
.my-parent:hover {
   background-color: green;
}
Say you want the background of my-parent to go red when hovering over "OK".  The above example will do that.  The problem is it'll go green when hovering over the Cancel button too.

Similar codes

13 votes377 views4 answers
How to print background bootstrap
CSS Bootstrap
8 votes305 views4 answers
Css padding 4 values
CSS
0 vote267 views3 answers
Div
CSS
11 votes303 views6 answers
Warning: LF will be replaced by CRLF in
CSS
2 votes292 views1 answer
Flex align top css
CSS
0 vote279 views1 answer
Shorthand notation of declaring top, right, bottom, left position
CSS
0 vote274 views1 answer
How to remove table border in css for last child if rowspan
CSS
24 votes287 views2 answers
Text-overflow: ellipsis; 2 line
CSS
0 vote287 views1 answer
Set margin to none inside print
CSS
33 votes299 views6 answers
Background image opacity css
CSS