As you can see in IE the content of div.docs will overflow even if wrap is specified when screen is small enough. All elements of div.docs will remain on one line while they should wrap onto the next line.
I fixed it by wrapping the contents of div.docs with a div.iewrap-fix:
I maybe have a case that is related to https://github.com/philipwalton/flexbugs/issues/170 (I posted this there as a comment). The sample is somewhat more complicated with more nested flexboxes.
https://jsbin.com/deticuzuvi/1/edit?html,css,output
As you can see in IE the content of div.docs will overflow even if wrap is specified when screen is small enough. All elements of div.docs will remain on one line while they should wrap onto the next line. I fixed it by wrapping the contents of div.docs with a div.iewrap-fix:
.iewrap-fix { flex:1 1 100%; display:flex; flex-flow:row wrap; }
One can optionally remove wrap on div.docs as well. (just uncomment div.iewrap-fix to see the corrected result in IE or view fixed here https://jsbin.com/foromukuna/1/edit?html,css,output)
Don't know if this fix is general enough to work in other cases as well. Fix seems to have no negative effects in chrome, firefox and edge
Added jsbin with fixed result here: https://jsbin.com/foromukuna/1/edit?html,css,output