Effect of Element Greediness on CSS Flex Box Compression

Now let's see the impact of greed. Let's remove width from all children and set their children's flex-grow to 1, and the second child to 3. As a result, the second block will be 3 times larger than the others.

However, if you compress the window strongly enough, the second block will no longer be larger than the others by 3 times - with strong compression, the difference is erased. See for yourself by playing with the example below, expanding and narrowing the browser window: