Issue with :nth-child()

[Rugg]

Hi,

I am using the **:nth-child()** pseudo selector to target a specific element. There seems to be an issue with the result and I can’t quite figure out how to solve it.

Below is a simple test case…Essentially the child selector is one element off the intentional target. All elements share the same class name, except for the first…And this seems to be where the nth count is thrown off.

The goal is to exclude the first element with the different class name…in this case that would be **.top** while targeting one element from the series of **.box** classes.

**Example:** http://jsfiddle.net/FJ5Y8/

Is there anyway to go about this properly? Any Help is appreciated.

Thank you

[Paulie_D]

Unfortunately, you can’t use nth-child to select classes only elements.

Previously discussed: https://css-tricks.com/forums/discussion/23420/nth-childnth-of-type-bug/p1

[TheDoc]

If there are going to be elements in there that you don’t want to to be counted, you should be using `nth-of-type`.

[Paulie_D]

As I said, you can’t apply it to classes…only elements.

`nth-child` **is** a class (albeit pseudo) and you can’t apply a class to a class.

EDIT: nth-of-type won’t work either AFAIK…same reason.

http://codepen.io/anon/pen/fIawL

[Author]

Posts