Nested flexbox adds empty space on IE10 and 11
问题 I'm using flexbox for a layout. My constraint is that the image must be situated at the middle. I've made a minimal markup that reproduces the issue: http://codepen.io/anon/pen/xwNomN It works perfectly well in all browsers EXCEPT on IE 10 and 11, where (as shown in the CodePen) a big amount of empty space is added at the top and bottom of the image. .collection__list { display: flex; flex-wrap: wrap; } .product-item { display: flex; flex-direction: column; justify-content: space-between; }