Можно ли сделать обтекание элемента внутри контейнера Flexbox?

Question

[Igor Lanko]

Приветствую!

Есть родитель:

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

И два дочерних:

.block {
   height: 100%;
}

.mini {
   height: 25%;
}

Хочется вот так:


Но получается вот так:


Важно:
1. Должен использоваться Flexbox
2. Не должно быть сторонних вложений в родитель .wrap
3. Это вообще реально?

Текущий пример кода на JSFiddle

Answer 1

[Valery]

jsfiddle.net/4cghpvyo/19

.wrap {
    flex-wrap: wrap;
    flex-direction: column;
}

.mini {
    box-sizing: border-box;
}

Comments

[Igor Lanko]

Спасибо! А как так получается, почему border-box?

[Евгений Петров]

Igor Lanko: Рамки задаёте? Задаёте. Размеры задаёте? Задаёте. А теперь просто погуглите, что делает border-box.