Re: [csswg-drafts] [css-syntax][css-shapes] Repeating segments in `shape()` (and perhaps as a generic thing?) (#13862)

I'm behind this, but I still think we need real Sass-like looping in CSS. Like `sibling-index()` this is just a way to go around a limited set of problems, while still leaving a lot of them out.

For example, I have this structure:

```html
<div class='container'>
  <div class='cursor-trap'></div>
  <div class='cursor-trap'></div>
  <!-- a loooot more cursor-trap elements -->
</div>
<div class='target'></div>
```

In the CSS, I need:

```css
.container:has(.cursor-trap:nth-child(1):hover) + .target { --i: 1 }

.container:has(.cursor-trap:nth-child(2):hover) + .target { --i: 2 }

/* and so on */

/* then use --i in computations for various property values on .target */
```

This is something `sibling-index()` cannot help with because what I need is the index of the currently hovered `.cursor-trap` element to set a value on the `.target` element.

The only valid solution at this point when there might be a few hundred `.cursor-trap` elements is using a preprocessor loop.

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


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

Received on Sunday, 10 May 2026 06:01:01 UTC