Re: [csswg-drafts] Proposal: grid-guideline property for visualizing grid lines in development (#12921)

This looks like a use case for [CSS Gap Decorations](https://www.w3.org/TR/css-gaps-1/), which would allow styling the gap directly which makes it possible to draw track separators.

For your specific example, you could achieve the desired outcome with a rule like this:
```css
rule: 1px dashed rgba(255,0,0,0.3);
column-rule-break: none;
row-rule-break: none;
```

One detail is that gap decorations are painted at container level and are not affected by z-index. For debugging purposes, you can temporarily set the items' opacity to less than 1 to see the decorations drawn behind items.

You can also refer to this [blog post](https://developer.chrome.com/blog/gap-decorations) for more on CSS Gap Decorations. cc: @kbabbitt 

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


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

Received on Thursday, 9 October 2025 15:05:03 UTC