문제

flex-direction: column이 문제가 되었는데 자식 영역의 height가 잡히지 않아서 전부 겹치는 문제가 생김.

Chrome환경에서는 문제가 없던 것이 IE에서 문제가 되었다.

해결

flex: 1을 flex: 1 0 auto로 바꾸니까 문제가 해결되었다.

IE10에서 flex의 기본값은 최신 사양에 정의 된대로 0 1 auto가 아니라 0 0 auto이기 때문이다.

(하하하)