You can filter nth-child results using the "of <selector>" syntax:

li:nth-child(2n of :not(.hidden)) {
  background-color: grey;
}

li.hidden {
  display: none;
}

This will apply alternating background colors for a list where some elements might not be visible (in this example, using the hidden class). For example, in this list "Two" and "Five" will have a grey background:

<ul>
  <li>One</li>
  <li>Two</li>
  <li class="hidden">Three</li>
  <li>Four</li>
  <li>Five</li>
</ul>
Final thoughts

For some reason my IDE doesn't recognize this yet, but yes, you can use it.

Mastodon Mastodon