Re: [csswg-drafts] [css-grid] Percentages gaps and intrinsic size

> So, just to make sure I understand the resolution above correctly, the resolution is that gaps resolves percentages the same as was decided for margin/padding in #347, except that the percentage basis for grid-row-gap/grid-column-gap continues to be same-axis content-box size, right?

I understand the same thing regarding that.

> Also, since there is some discussion of percentage track sizes in general in this issue - those continue to "behave as auto" when the percentage base is indefinite as before, right?

No, they would behave as auto but then they'll be resolved during layout.
That's what all browsers do for column tracks, but none for row tracks.
That was resolved in the past in #1921, but none of the implementations have supported this yet.

With the resolution here from yesterday, gaps would be working pretty similar to tracks.
Contributing zero during intrinsic size computation and resolving after layout,
so row-gap will work the same than column-gap.

So for gaps if we have this example:
```html
<div style="display: inline-grid; border: 10px dotted red;
            grid-template-columns: auto auto; grid-gap: 25%;
            font: 50px/1 Ahem;">
  <div style="grid-column: 1; background: magenta;">XÉpp</div>
  <div style="grid-column: 2; background: cyan;">XÉpp</div>
  <div style="grid-column: 1 / 3; background: yellow;">XÉpp</div>
</div>
```

It'll have a column gap of 100px and a row gap of 25px. While the size of the grid container will be 400px width and 100px height.

![Expected output of the previous example](https://user-images.githubusercontent.com/11602/39579421-056b42d2-4ee7-11e8-8c64-6c72b04ce79a.png)



-- 
GitHub Notification of comment by mrego
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/509#issuecomment-386296399 using your GitHub account

Received on Thursday, 3 May 2018 13:32:01 UTC