Check out example codes for "how to apply a transition to a child element when hovering over parent element". It will help you in understanding the concepts better.

Code Example 1

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

Learn ReactJs, React Native from