<sibling-index>
A new experimental function that returns the 1-based index of an element among its siblings. You can use it to create staggered animations or dynamic styles without nth-child(n) hacks.
Quick example
.list-item {
/* Staggers the animation delay based on the item's position */
animation-delay: calc(sibling-index() * 100ms);
}<sibling-index> Browser Support
Limited availability 70% global usage
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Not ready for production without a fallback.
138+
26.2+
138+