CSS multicol block direction wrapping
Ever since I became an editor of the Multiple-column layout specification I've wanted to add the ability to let overflow columns wrap in the block direction, rather than extend out in the inline direction—creating the sort of horizontal scrollbar that almost nobody wants. And, now we're doing it. I'm working on the specification (which is...
ver since I became an editor of the Multiple-column layout specification I’ve wanted to add the ability to let overflow columns wrap in the block direction, rather than extend out in the inline direction—creating the sort of horizontal scrollbar that almost nobody wants.
And, now we’re doing it. I’m working on the specification (which is in a very draft state right now). There’s also an experimental implementation behind a runtime flag in Chrome Canary, thanks to the work of Morten Stenshorne at Chrome.
If you want to follow along as we pick through the details, keep an eye on the css-multicol-2 tag.
You can also check out the experimental implementation by starting Canary with the MulticolColumnWrapping flag. See Chrome flags for how to do that. This CodePen should then show you a multicol with multiple rows, as in the following screenshot.
Did you enjoy this article?
Recommend it — Standard Reader surfaces well-loved writing to more readers across the network.