2

I'm trying to maintain odd/even list item styling, when some list items are hidden with a filter (using the hidden attribute).

I thought I could achieve it like this:

li:not([hidden]):nth-of-type(odd) {
    background: yellow;
}
li:not([hidden]):nth-of-type(even) {
    background: green;
}

but when I hide list item #2, list item #3 stays 'odd'. I thought it would become even, since it is now the second list item without a 'hidden attribute:

<ul>
    <li>Item 1</li> // yellow
    <li hidden>Item 2</li>
    <li>Item 3</li> // yellow but should be green?
    ..
</ul>

Is it possible with pseudo selectors/not:() to do the above? Or is hidden just not observed with odd/even?

Thanks

Neil

neil
  • 1,246
  • 1
  • 12
  • 20

0 Answers0