Свиване на flex блокове при недостигнато място в CSS

Нека имаме три flex блока, разположени вътре в родителя в ред. На всеки блок-потомък е зададена ширина от 100px, а на техния родител - 300px:

Нека добавим още блокове, така че общата ширина на тези блокове-потомци да бъде по-голяма от ширината на техния родител. В този случай ще видите неочакван ефект - ширината на блоковете ще намалее така, че всички да се поберат в техния родител, въпреки че на блоковете-потомци е изрично зададена ширина: