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 
me)
`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 
https://github.com/w3c/csswg-drafts/issues/945#issuecomment-273485029 
using your GitHub account
Received on Wednesday, 18 January 2017 14:13:27 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 19 October 2021 01:30:28 UTC