fix(select): animation jumping on IE11 (angular#10050)

Fixes the select animation looking off in IE11 by starting from the end, before resetting to the beginning and animating again. Seems to be due to the fact that we haven't defined the initial state, but we were setting it as a keyframe in the animation.

src/lib/select/select-animations.ts

@@ -38,6 +38,11 @@ export const matSelectAnimations: {
    * When the panel is removed from the DOM, it simply fades out linearly.
    */
   transformPanel: trigger('transformPanel', [
+    state('void', style({
+      transform: 'scaleY(0)',
+      minWidth: '100%',
+      opacity: 0
+    })),
     state('showing', style({
       opacity: 1,
       minWidth: 'calc(100% + 32px)', // 32px = 2 * 16px padding
@@ -50,11 +55,6 @@ export const matSelectAnimations: {
     })),
     transition('void => *', group([
       query('@fadeInContent', animateChild()),
-      style({
-        opacity: 0,
-        minWidth: '100%',
-        transform: 'scaleY(0)'
-      }),
       animate('150ms cubic-bezier(0.25, 0.8, 0.25, 1)')
     ])),
     transition('* => void', [