CSS: Animate two elements in single :hover action

I’m following the new CSS Animation trail and for the first excercise, I can’t figure out how to make two elements react in single :hover action.

Codepen: http://codepen.io/anon/pen/jEqMyv

The two div elements respond to the :hover state but i want them react together. I hope I’m making myself clear.

What’s similar about the two elements? You should try targeting the similar element (in this case, the parent li), and use the child selector (>) to trigger the animations. Let me know if you’re still running into problems and I’ll update the Codepen.

I had the wrong concept when I asked the question. Coming from JS, i was thinking if there’s a way to somehow chain the animation conditionally. Thanks for the answer, after some few tries I got it working.