how do i change the css of parent element when hovering over child code example
Example 1: how to select child when hover on parent element css
.parent:hover .child {
}
Example 2: how to apply a transition to a child element when hovering over parent element
.parent {
background: red;
}
.child {
overflow: hidden;
height: 0;
background: blue;
-webkit-transition: all .8s ease;
-moz-transition: all .8s ease;
-ms-transition: all .8s ease;
-o-transition: all .8s ease;
transition: all .8s ease;
color: white;
}
.parent:hover > .child {
height: 30px;
display: block;
}