Moved key requirement note into 'getting started'

It's an important note and it was buried too far down the page. Now it's more prominent and harder for people to miss (like I did).

docs/09.1-animation.md

@@ -52,6 +52,9 @@ var TodoList = React.createClass({
   }
 });
 ```
+> Note:
+>
+> You must provide [the `key` attribute](/react/docs/multiple-components.html#dynamic-children) for all children of `ReactCSSTransitionGroup`, even if rendering a single item. This is how React will determine which children have entered, left, or stayed.
 
 In this component, when a new item is added to `ReactCSSTransitionGroup` it will get the `example-enter` CSS class and the `example-enter-active` CSS class added in the next tick. This is a convention based on the `transitionName` prop.
 
@@ -128,10 +131,6 @@ var ImageCarousel = React.createClass({
 });
 ```
 
-> Note:
->
-> You must provide [the `key` attribute](/react/docs/multiple-components.html#dynamic-children) for all children of `ReactCSSTransitionGroup`, even if rendering a single item. This is how React will determine which children have entered, left, or stayed.
-
 ### Disabling Animations
 
 You can disable animating `enter` or `leave` animations if you want. For example, sometimes you may want an `enter` animation and no `leave` animation, but `ReactCSSTransitionGroup` waits for an animation to complete before removing your DOM node. You can add `transitionEnter={false}` or `transitionLeave={false}` props to `ReactCSSTransitionGroup` to disable these animations.