W3C home > Mailing lists > Public > public-css-archive@w3.org > January 2017

Re: [csswg-drafts] [css-grid][css-flexbox] Pinterest/Masonry style layout support

From: Jonas via GitHub <sysbot+gh@w3.org>
Date: Wed, 18 Jan 2017 14:13:16 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-273485029-1484748795-sysbot+gh@w3.org>
I'm new to this process, so please point me in the right direction if 
I've misunderstood anything or should be proposing solutions somewhere
 else, or at a later point in time.

In order to fit the Masonry style layout in Flexbox, `flex-direction` 
could be extendeed with two additional values: `row-cross` and 
`column-cross`. (or something like that - naming isn't important to 
`column-cross` would have the block direction as main axis, like 
`column`, but laying out flex items one by one along the cross axis, 
as if wrapping on to multiple lines.
`row-cross` would be similar, but have inline direction as main axis.
By adding a `flex-wrap` value of `wrap` or `wrap-reverse`, the flex 
items would be wrapped and dispersed between lines in the direction of
 the chosen cross axis.

This approach would still have the problem of flex-items not being 
"intuitively placed" i.e. a flex item might be before another in 
order, but be farther from the `main start` than that other item - 
somewhat breaking the (assumed) Masonry expectation that earlier items
 appear first when scrolling.

GitHub Notification of comment by Zatnosk
Please view or discuss this issue at 
using your GitHub account
Received on Wednesday, 18 January 2017 14:13:27 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:41:07 UTC