Flex-lohkojen supistuminen tilan puutteen sattuessa CSS:ssä

Oletetaan, että meillä on kolme flex-lohkoa, jotka on asetettu riviksi vanhempansa sisään. Jokaiselle lapsilohkolle on asetettu leveys 100px, ja niiden vanhemmalle - 300px:

Lisätään enemmän lohkoja niin, että näiden lapsilohkojen kokonaisleveys olisi suurempi kuin niiden vanhemman leveys. Tässä tapauksessa näet odottamattoman vaikutuksen - lohkojen leveys pienenee niin, että ne kaikki mahtuvat vanhempaansa, huolimatta siitä, että lapsilohkojen leveys on eksplisiittisesti asetettu: