[css-flexbox] Intrinsic sizes and flexibility


There is interesting case questioned at http://toster.ru/q/170371 (in  
Shortly, it was asked to make an image with caption centered on the page  
with Flexbox.
When the page is too narrow or short the image should be smaller.

I've drafted it here: http://codepen.io/GreLI/pen/RNKoxo

It can be seen there that the image doesn't keep its proportions. It works  
with max-width:100%, but not with max-height:100%–in this case height  
resolves relative to the whole display:flex element (<figure>) size  
including caption height. The worst part that one can't limit the height  
using wrapping element since it wouldn't have definite height. I guess  
that happens because there is no place in spec that says that replaced  
elements should keep it intrinsic proportions after resolving flexible  
lengths (on main axis).

I believe it's a considerable defect which brokes author expectations.

Received on Thursday, 22 January 2015 13:48:40 UTC