Do: nth-of-type (n) "n" counters increment independently in the same CSS rule?

Does n counters independently set in: nth-of-type () selectors? For example, if I need the label: checked: nth-of-type (3) to match her common sisters article: nth-of-type (3), should this technique work? (This is not the case, but maybe I just want to be sure.)

label:checked:nth-of-type(n) ~ article:nth-of-type(n) 

The idea is not to explicitly say: nth-of-type (1),: nth-of-type (2), etc.

+6
source share
1 answer

Unfortunately, for you, the counter n is local to nth-of-type , where it is defined, so your method will not work. You would need to do something like this:

 label:checked:nth-of-type(1) ~ article:nth-of-type(1), label:checked:nth-of-type(2) ~ article:nth-of-type(2), label:checked:nth-of-type(3) ~ article:nth-of-type(3), label:checked:nth-of-type(4) ~ article:nth-of-type(4), label:checked:nth-of-type(5) ~ article:nth-of-type(5), ... { /* definitions */ } 

... it is a pain. I see where you are going with him, and it would be great to use something like that!

+1
source

Source: https://habr.com/ru/post/903168/


All Articles