mapping data from json array for multiple data gives error in react and webpack

I am trying to map data from a json array as follows

{movies.map((item. i) => (
  <RecentItem item={item} index={i} />
))}

when it displays it works but when I hover over the data it hides the next data image when hovered the image when not hovered when not hovered what is wrong below is my styling for the hover

    &:hover {
        width: 372px;
        height: 372px;
        position: absolute;
        top: -150px;
        -webkit-box-shadow: 0px 0px 15px 0px rgba(61, 61, 61, 0.07);
        box-shadow: 0px 0px 15px 0px rgba(61, 61, 61, 0.07);
        border-radius: 5px;
    }

pls if you need more codes let me know, thanks