[css-grid-2] option to specify an optional sequence of track sizes

pmccloghrylaing commented 5 years ago

Spec: https://www.w3.org/TR/css-grid-1/#auto-repeat

In a number of scenarios flexbox and grid are able to respond to their content and container to achieve layouts that people want container queries for (which seem unlikely to happen). Being able to define a completely collapsible sequence of tracks would allow things like switching from a layout of X columns 1 row to 1 column wide X rows depending on the size of the container. In my case I'm looking at ways to switch between a 3×1 and 1×3. This would also allow things like odd numbers of columns/rows down to 1 instead of 3.

This could work with repeat so it could be used with auto-fill/fit, maybe as an additional keyword - repeat(3 optional, ...) or repeat(auto-fit optional, ...)?

tabatkins commented 5 years ago

Is the proposal here to have an "all or nothing" repetition? I'm not totally sure I understand.

pmccloghrylaing commented 5 years ago

My original thought was wanting auto-fill (and auto-fit) to be able to work as "0 or more" repetitions instead of "1 or more".

That seems really powerful to me, mainly for defining components that can be laid out horizontally or vertically.

An example of this could be a sign in form that appears in different contexts (with different container widths) that should be either:

+---------------+---------------+---------------+
| Username      | Password      | Log In        |
+---------------+---------------+---------------+

or:

+---------------+
| Username      |
+---------------+
| Password      |
+---------------+
| Log In        |
+---------------+

but not:

+---------------+---------------+
| Username      | Password      |
+---------------+---------------+
| Log In        |               |
+---------------+---------------+

w3c / csswg-drafts

[css-grid-2] option to specify an optional sequence of track sizes #3328