Re: [css-grid] Flowing items within columns/rows

On Sun, Mar 6, 2016 at 6:55 AM, Nate Green <heynategreen@gmail.com> wrote:
> Hello. I would like to verify whether the following capability is afforded by the grid layout spec:
>
> I would like to take items from within a swathe of content in one column and place them into another column. However, content in each column should appear right below the previous item in that column, as if they were flow items within a container. In other words, rather than laying out items in a column as if they are cells in a table (where each item is aligned to a row of items in the other columns), items would be placed in a column one after another, with no apparent row alignment.
>
> An example to (hopefully) clarify what I mean: putting contextual notes (children of paragraphs) into the margin of a page as one list; in my testing I have only been able to put them in a column if they align to the paragraphs (and not necessarily to the paragraphs they belong with).

Unfortunately, we don't (currently) have the ability to put several
grid items in a single cell and have them "flow together".  This is
definitely a part of several use-cases we want to address, but it
complicates implementations a good bit and so we left it out of v1.

As François says, if you're on a browser that happens to support
Regions and Grid, you can do this by combining those two techs.  This
capability is basically a slightly-restricted form of the Regions
functionality, which is why we don't have it built into Grid - several
browsers rejected Regions for complexity reasons, at least for now.

(As an aside, this is actually restricted *enough* that it falls right
into the same "use a Grid in one axis but not the other" use-case that
Masonry wants.  I think this is *very* doable; as long as the items
are okay with all being formatting contexts, it's only a tiny bit more
complex than normal Grid  - it's just a grid item whose position in
one axis is dependent on the sizes of previous elements in that axis.
I'm very confident we'll be able to do something for this in Grid 2.)

~TJ

Received on Monday, 7 March 2016 19:07:01 UTC