css :hover를 사용해서 간단히 구현할 수 있다고 생각했던 기능이 있습니다. pacakges: React, styled-component 아래의 gif 같이 마우스를 올렸을 때, 마우스가 올라간 컴포넌트만 배경의 색이 바뀌어야 했는데요. css의 :hover를 사용하니 원하는 대로 동작하지 않았습니다. css만 사용해서 원하는 hover 동작을 만드려고 하니 부모 컴포넌트만 배경색이 바뀐다거나, 자식 컴포넌트의 색깔만 바뀌었습니다. 혹은 모든 컴포넌트에 적용이 되었습니다. 자식 컴포넌트에 마우스를 올리면 부모에도 css로 적용한 :hover가 적용이 되었습니다. 이렇게요. css 부모 선택자를 활용해보거나, nth-child를 활용해보려 했지만 원하는 동작을 구현할 수 없었습니다. 더불어, 이후에 ..
