W3C home > Mailing lists > Public > www-style@w3.org > February 2015

Re: [css-grid] repeat(auto) issue

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Thu, 12 Feb 2015 08:39:43 +1100
Message-ID: <CAAWBYDAqK_hgMzzhjLRvvo4_PRS7wVsvfQq_0SU09c7R7SkS6A@mail.gmail.com>
To: François REMY <francois.remy.dev@outlook.com>
Cc: CSS WG <www-style@w3.org>
On Thu, Feb 12, 2015 at 6:45 AM, François REMY
<francois.remy.dev@outlook.com> wrote:
> ± > There’s something I don’t like the current repeat(auto, …) definition
> ± > : it doesn’t allow to solve what I think are useful use cases:
> ± >
> ± > Let’s figure out I want a grid of items that’s centered horizontally
> ± > inside a container. The grid is possibly complex (multiple line names
> ± > per repetition block) and cannot be emulated by a flexbox.
> ± >
> ± > If I want the amount of repetition to be constrained by a max-width
> ± > constrain AND by the amount of repetitions required to display all
> ± > items of the grid (to preserve the right horizontal centering), then
> ± > I’m out of luck right now.
> ± >
> ± > I prefer a definition of “auto” which adapts by attempting to create
> ± > more repetition as the automatic placement algorithm wrap for the first
> ± time.
> ± > This means multiple passes of the placement)layout for the first line,
> ± > but this is way better to solve many use cases.
> ±
> ± I don't understand what's wrong with the current definition, based on your
> ± description.  Can you provide more detail about the case you're talking
> ± about?
> I've attached a mockup of the design I've in mind: in an inline flow, a photo gallery is designed as a grid (whose items are possibly subgrids so that elements align across items on a row...). This grid doesn't have a definite width (but has a max-width of 100%). That grid is centered and has to contain as many columns as required by the amount of items it contains, with the constraint is has to create a new line once it exceeds its max width.
> In fact, this is very similar to a wrapped "flexbox" layout but with alignment constraints which a flexbox layout cannot give you, including "gaps" between elements which require specific empty columns.
> To me, the issue is that the cases for which you can use automatic repetition is really too narrow. I would prefer to get something closer to what we have for flexboxes.

So it sounds like you're asking for auto-sized rows in repeat(auto)?
This doesn't seem to make a lot of sense to me; you only get the
flexibility of auto-sizing on the items that happen to fit in the
first row, but all further rows are constrained.  It kinda makes your
design responsive to the item size, but only the first few items, and
I doubt that's all that useful.  If your items are regular enough for
it to be worthwhile, they're regular enough for you to guess at the
size and just use that in repeat(auto); if they're not regular enough,
then the grid constraints on later rows are likely to actually be
unpalatable, and you're likely better off with a wrapping flexbox.

I suspect what you really want is some sort of balancing across all
the items, which to be realistic, isn't likely to be specced; the
behavior is at least O(n^2).  With the upcoming Measure API being
defined in HoudiniTF, though, you can implement it yourself with
whatever algorithm you wish, setting up the size/number of columns and
the order of items in script.

Received on Wednesday, 11 February 2015 21:40:31 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:51 UTC