Angular Flexbox: how to set max width to a div

Question

I'm using Angular Flexlayout (based on FlexBox) to add responsiveness to my application.

Is it possible to set a max-width to a HTML element?

Example:

<div fxFlex.gt-md="70" fxLayout.lt-lg="100"> 
<!-- I want this div to have a maximum width of 1750px. 
Setting max-width has no effect. How can I achieve this? -->
</div>

Answer 1

The solution is to use the "shrink" and "grow" value of the FxFlex tag. Grow: How to grow the element Shrink: How to shrink the element Initial: Initial value

Examples:

fxFlex="grow shrink initial"
fxFlex="0 1 70" <- Will not grow, will shrink 1:1, initial value of 70%
fxFlex="0 1 1750px" <- Will not grow, will shrink 1:1, initial value of 1750px

Documentation here