Как получить гибкие колонны, чтобы обернуть вокруг позиционированного элемента? ⇐ Html

[Anonymous]

У меня есть контейнер, который содержит список с произвольным количеством элементов, каждый с произвольной высотой. Я хочу, чтобы элементы обернули в столбце, что достаточно просто с помощью Flexbox. < /P>
ul {
display: flex;
flex-flow: column wrap;
height:300px;
}

li {
list-style-type:none;
}
< /code>
Но я также хочу элемент, расположенный в верхнем правом контейнере, который должны обернуться с гибкими столбцами. Так что это выглядит примерно так, желтые - это элементы списка, а синий - фиксированный элемент:

Как я могу это добиться?
https://jsfiddle.net/d25uqtpx/

Подробнее здесь: https://stackoverflow.com/questions/794 ... ed-element