Flexbox: How to make content take up remaining space after fixed sidebar

I would put it this way.

flex-basis is describing the original widths of the elements. If the combined width of all the elements is smaller than the available space, flex-grow becomes relevant. Elements will grow by an amount based on the proportion between their flex-grow value and the sum of all the flex-grow values. If the combined width of all the elements is larger than the available space, the elements will shrink by an amount based on the proportion between their flex-shrink value and the sum of all flex-shrink values.

There's no way for flex-grow and flex-shrink to be used at the same time. You can only know how much an element will grow or shrink by knowing the relevant values of all the neighbour elements.

Hope this is helpful!