Теперь вы знаете достаточно, чтобы пройти финальное испытание.

В нём снова нужно создать гибкую раскладку, но на этот раз задача усложнилась. Теперь блоков стало больше, они расположены не в один ряд и у них разные размеры.

Вам понадобится подобрать базовые размеры, отступы, некоторые коэффициенты и пару других флексовых свойств.

Подсказка: как всегда отступы и базовые размеры (до перераспределения свободного места) кратны 5.

До встречи в следующих частях. Продолжение следует!

Решение

Решение испытания будет доступно через несколько минут. Используйте его, если возникнут сложности. А пока попытайтесь пройти испытание самостоятельно.

.brick-layout {
  width: 400px;
  padding: 5px;
  box-sizing: content-box;
}

.brick {
  min-height: 80px;
  min-width: 50px;
}

.brick-layout {
  display: flex;
  flex-wrap: wrap;
}

.brick {
  margin: 5px;
  flex-basis: 100px;
}

.brick:nth-child(even) {
  flex-grow: 1;
}