Bulma: Bulma columns don't wrap?

[JenCant]

Overview of the problem

When using Bulma's cards, they do not wrap by default and overflow horizontally so that any columns that do not fit are hidden. This might be intentional and therefore not a bug but I expected flex items to wrap rather than become hidden?

This is about the Bulma CSS framework

I'm using Bulma version [0.5.0]
My browser is: Chrome 60.0.3112.78 (Official Build) (64-bit)

Steps to Reproduce

Here's a codepen below, but essentially this happens to all <div class="column"> if they add up to more than 12 within a "columns" container.
https://codepen.io/sigil/full/dzGQQJ

Expected behavior

I thought that they should automatically wrap, rather than have the overflow become hidden?
I get around this behaviour by just adding: flex-wrap: wrap to the "columns" div.

A screenshot of my workaround:

Actual behavior

The divs that "overflow" are hidden.
https://codepen.io/sigil/full/dzGQQJ

A screenshot from my project:

[VizuaaLOG]

If you add is-multiline to your .columns element it should wrap automagically.

[JenCant]

Ah that does it. Thanks - I must have missed that in the docs.

[VizuaaLOG]

No worries. Have fun!