Анимирование Flexbox с помощью CSS Transition

[CCgames]

с background-size: 100% 100%; в ховере получается немного интереснее, ибо у большой картинки часть снизу и слева обрезается, а с учетом того, что в данном примере все картинки квадратные, думаю так покрасивее получается…

[radyno]

Да, не учел этого. Обновил демки. Спасибо.

[Boomburum]

Извините за оффтопик, но не могу не отметить классное оформление поста – в «песочнице» это редкость!

[Reon]

«Поскольку Flexbox работает в IE10+, соответственно, и его анимация будет работать не менее, чем с 10-й версии»

Анимация Flexbox в любом IE не будет работать.

[radyno]

Да, вы правы. Почему-то я был уверен в обратном. Обновил информацию.

[mayorovp]

К сожалению, у анимации flex есть одна проблема: анимируется только перераспределение свободного места, но не занятого. В частности, именно по этой причине анимация сворачивания выходит плавная, а анимация разворачивания происходит рывком.