Forums

Give help. Get help.

  • # April 10, 2013 at 1:16 pm

    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

    # April 10, 2013 at 2:07 pm

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

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

    # April 10, 2013 at 2:15 pm

    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`.

    # April 10, 2013 at 2:16 pm

    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

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag