A flexbox can allocate its unused space to its children, growing them to fill all available space. Final size of each child depends on its flexbox-related properties like flex-growth and flex-basis.
In this example child2 and child3 start with flex-basis:auto. This means child height is counted when flexbox calculates parent unused space, and any allocated space is "tacked on" to the child. But use that checkbox to set flex-basis:0px and you'll see sizing change as the child's height is treated as 0.
Child1 has flex:none so it doesn't grow or shrink, it just sizes to its height:40px (and this height is counted in the unused space calculation).
Parent height: 250
Parent unused space = parentHeight - child1height xxx
Child 1. flex:none (0 0 auto), height:40px
Child 2. flex:1 0 auto, height:60px, flex'd ht: ??px
Child 3. flex:3 0 auto , height:50px, flex'd ht: ??px
Note: px values may be rounded