Also, why not use
flex-basis:25em; flex-grow:1; on
.container > * instead of what you have there already? i.e. The “Fab Four” calc method, which seems to make more sense in circumstances where no flexbox at all can be used. Why mix them? If you’re using flexbox, why not use it all the way?