/CSS/How to apply a transition to a child element when hovering over parent element

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;
}

Source: stackoverflow.com

Similar codes

0 vote362 views1 answer
Html click through image
CSS
0 vote359 views2 answers
How to add an image to a label in css
CSS
-1 vote375 views2 answers
Css good background color
CSS
2 votes361 views6 answers
Tailwindcss
CSS
0 vote323 views1 answer
Sass file
CSS
27 votes343 views1 answer
Css how to create gradients on text outline
CSS
0 vote356 views1 answer
Roam research
CSS
1 vote340 views1 answer
Change the color of an hr
CSS
0 vote340 views1 answer
Import scss
CSS
0 vote352 views1 answer
Code to change size when hover effect
CSS