Flex layout

.col
.col .col
.col .col .col
.col .col .col .col
.col .col .col .col .col .col

Nested flex containers

Using nesting so columns keeps the same width as flex items put directly in container, aligned to above examples.

.col
.col .col

Using ".col-x" classes to grow content in container

.col .col-x2 .col
.col .col-x3 .col
.col .col-x4 .col