CSS Flex Box is a great way to create fluid layouts (horizontal & vertical), but sometimes you don’t want the Flex display property to filter down to all child elements. In this case you need to set the Flex to none on the child element you don’t want to flex. The CSS is very simple:-
This is equivalent to
flex: 0 0 auto;
and that is shorthand for:-
flex-grow: 0; flex-shrink: 0; flex-basis: auto;
And you could link this up with:-
An example for using this could be on a Google Map that has a flex parent. You want the Google Map as a display: block; with no flex so add the above to its container.