Re: [csswg-drafts] [css-gaps] Gap decorations with collapsed gutters (#11814)

After further consideration, I’d like the CSSWG to revisit the resolution regarding coincident gap decorations caused by collapsed tracks. The current resolution states that all but one decoration should be suppressed when tracks collapse, using border-collapsing rules to determine which decoration “wins.”

While I understand the intent behind this approach, I believe it introduces unnecessary complexity and reduces predictability. Border-collapsing rules were designed for tables, where competing border styles are visually apparent and hierarchical precedence makes sense. Applying those rules to grid gaps feels less intuitive to web authors. Authors also lose direct control over which gap decorations appear in visible gutters.

Additionally, I believe collapsed tracks are somewhat of an implementation detail of `auto-fit`. Most authors use `auto-fit` to fill available space, not to necessarily reason about collapsed tracks. They typically don’t expect these internal mechanics to influence visual outcomes.

### Proposed resolution:
Gap decorations should map cleanly to _visible_ gutters in the order they are specified. This approach is simpler, predictable, and gives authors explicit control.

### Example
Consider:
```css
grid-template-rows: repeat(auto-fit, 20px);
row-rule-color: red blue green yellow brown teal purple
```
Under the current resolution, for the first visible gap, {red, blue, green} would compete, and border-collapsing rules might select blue. The next visible gap might then show yellow:
<img width="1003" height="632" alt="Image" src="https://github.com/user-attachments/assets/faec446f-e3d1-43d9-b14e-b8a42fc2d973" />

With my proposal, decorations would apply sequentially to visible gaps in declaration order, producing a clearer and more consistent result:
<img width="1003" height="632" alt="Image" src="https://github.com/user-attachments/assets/eb245994-9e08-43d0-beb7-b9fa07e6ac98" />

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


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Thursday, 6 November 2025 23:44:59 UTC