В задании 17/32 значения свойств align-content и align-items изначально установлены по умолчанию (stretch). При таких условиях ряды элементов растягиваются на весь флекс-контейнер, а сами элементы - на весь соответствующий ряд.
- Если установить высоту любого из элементов первого ряда более 20 пикселей (например, .simeon { height: 40px; } ), то происходит сразу два параллельных процесса:
а) Два других элемента первого ряда увеличиваются в высоте, вместе со всем первым рядом
б) Второй ряд, состоящий из единственного элемента .massimo становится ниже (как и сам элемент)
- Если установить такую же высоту для элемента второго ряда .massimo { height: 30px; }, то:
а) элемент .massimo закономерно станет ниже, а второй ряд в целом - выше
б) Первый ряд станет ниже
Как вообще объясняется подобное поведение а) и б) ?