Flexbox Playground

RTL: Writing Mode:
Fork me on GitHub

flex-direction: column;

flex-direction: column-reverse;

flex-direction: row;

flex-direction: row-reverse;

flex-wrap: nowrap;

flex-wrap: wrap;

flex-wrap: wrap-reverse;

align-items: baseline;

align-items: center;

align-items: flex-end;

align-items: flex-start;

align-items: stretch;

justify-content: center;

justify-content: flex-end;

justify-content: flex-start;

justify-content: space-around;

justify-content: space-between;