How would u go on solving this? transition-delay on dynamic number of divs

HTML & CSS
1

Lets say I have a number of elements, it can be 10, 15 or 100… or whatever number. I want to add transitions to these, and I want to add a delay to each, which gets higher for each element. If I had 5 elements and no more or less I could do like this:

div:nth-child(1){
transition-delay: .1s;
}
div:nth-child(2){
transition-delay: .2s;
}
div:nth-child(3){
transition-delay: .3s;
}
div:nth-child(4){
transition-delay: .4s;
}
div:nth-child(5){
transition-delay: .5s;
}

But how could I do the same with a dynamic number of elements?

EDIT: Found this:

And it works fine, but how can i write the from 1 through 3 to “from 1 through insert-dynamic-number” ?=)

2

Perhaps you should look into quantity queries

This could probably be adapted for your transitional use.

3

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.