[css-grid] Percentages of indefinite sizes in grid gaps

[svillar]

Hi,

back in March there was a thread on www-style about adding percentages to grid gaps (see https://lists.w3.org/Archives/Public/www-style/2016Mar/0385.html). I am not convinced at all that such a feature is needed, and I'd like to see real use cases (I guess that's why is at risk).

Anyway I think the percentage resolution for grid gaps is not properly specified whenever we have indefinite sizes. For in flow blocks we resolve that to 'auto' but that does not make sense for grid gaps. What should we do in those cases? (Note that we could do a 2nd pass to resolve the percentages but that's a pretty bad idea IMO).

[fantasai]

I'm perfectly happy to drop them. They'd otherwise behave exactly as empty percentage-sized tracks.

[svillar]

When you say drop them you mean making them 0px?

[fantasai]

I mean making them invalid.

[svillar]

I agree with you FWIW

[tabatkins]

The WG agreed to add it originally to make gutters more consistent with normal tracks; an all-percentage grid does make some sense. (The rest of the track sizing values aren't relevant for gutters, either because they depend on content or because the justify/align-* properties reasonably duplicate the functionality.)

So I'm Agenda+ing this to see if the WG prefers to keep or drop them. I'm not wedded either way, this was mostly just a change for consistency/completeness.

[fantasai]

I edited in some clarifications here to say they're treated as empty tracks.
Percentage gutters are currently marked at-risk, so I think we'll leave them in the spec for now as it's trivial to drop later. Feel free to treat them as low priority. If you'd rather we dropped them from the spec, let me know and we'll bring that up with the WG; it shouldn't be a problem from our perspective either way.

[rachelandrew]

I've been offline pretty much for the last few days, but led a layout workshop here in Australia where a number of people asked (without prompting from me) if percentages were valid for gaps. Seems that even with fr units being a thing, people are interested in creating percentage grids. So that is somewhat anecdotal but comes from authors that there is interest in such a thing.

[fantasai]

So, question: were these people trying to do something that is better done with frs and just didn't think of that solution, or were they really wanting percentage-based gaps (that increase with size of container)?

[rachelandrew]

Partly I think it is that authors are going to see everything in terms of percentages as the fr unit is brand new.

However having gaps that increase with the size of the container is definitely a valid requirement. You see people calculating percentage based margins when doing float based multiple column layouts. For example this grid system: http://www.responsivegridsystem.com/

[mrego]

Just to clarify the expected behavior, imagine a grid with indefinite width and height (e.g. an absolutely positioned grid container) where we set the following properties:

  grid: 100px 100px / 200px 200px;
  grid-gap: 10%;

• The gap between columns would be 40px. As it uses the intrinsic size of the grid container (400px) to resolve the percentage. That's the same behavior than the one we use to resolve a 10% column in this case.
• However, the gap between rows would be 0px.

BTW, percentage gaps are already implemented on Firefox since a while ago, and we've some patches WIP in Blink and WebKit, so it should be ready there too.

[rachelandrew]

That makes sense to me, as there isn't anything to resolve the row percentage against. I think people will be keen to have percentages between columns, but then use absolute units between rows.