css nth child from element with class

Question

I there a way of selecting (using css) the nth child from an element with a certain class. For example, for the following, how could I select the li element with th

Answer 1

You use combinators to select an element relative to another element (which I'll refer to here as the reference element).

In this case, as you want the second sibling after li.selected, you need to step forward by two elements, using two + sibling combinators:

li.selected + li + li

As mentioned, you will need to repeat + li n times to reach the nth following sibling of your reference element (see also this related answer). There is no nth-sibling combinator, and :nth-child() is not designed to work with relative selectors.

Answer 2

Actually you could do with + selector. It is a bit dirty, but works in your case. All you need is to know the exact position of element you need.

.selected + li + li (adding + li as much times as you need)