If we have to make a certain design where we have to divine available space such that in one row only two flex items are to be retained.
I think this property will do the needful:
flex: 1 0 50%;
flex-wrap: wrap, but this doesn’t give a gap between the two left and right.
Either we give padding-left ton flex right element or
we give padding-right to the flex left element.
Margin may be the other rescue.
Another alternative will be to give a middle div in the middle and set margin/padding or certain fix width there so that in case of swap of flex-direction still the middle, space remains the same.
This is what I know. Is there any evolved and more professional way to cater to such situations?