css - How to make the items to overflow into columns? -

i have div place inside foreach loop records 1 one in column, this:

aaa bbb ccc ddd eee

the problem box has static height, , elements go outside of div, while want on overflow:

aaa ddd bbb eee ccc

how can this?

you try flexbox, add align-content: flex-start; if need items positioned @ beginning of container.

browser support tables, , vendor prefix details here.

div {      display: flex;      flex-flow: column wrap;      border: 1px solid red;      height: 60px;  }

<div>      <span>aaa</span>      <span>bbb</span>      <span>ccc</span>      <span>ddd</span>      <span>eee</span>  </div>

Dil