Comments on: :nth-of-type

By: Ully

Ully — Tue, 19 May 2020 00:04:33 +0000

Thank you!! I was having a hard time to understand this selector, thank you very much!

By: Nathan

Nathan — Sun, 07 Jul 2019 22:11:05 +0000

This may sound silly, but how does nth-of-type deal with gaps in the count? Say my code is li.count-me:nth-of-type(2n+1){ background-color: #F00; } Surely then my CSS should work as follows:

<li class="count-me">I should be red</li>
<li class="count-me">I should not be red</li>
<li class="count-me">I should be red</li>
<li class="donot-count-me">I should be ignored</li>
<li class="count-me">I should not be red</li>
<li class="count-me">I should be red</li>

Yet, when I have tried it, the final two <li>s are the opposite of what they should theoretically be - the one that should not be red is, and the one that should be red is not. Is there a way of having CSS ignore the gaps, or skip over the elements it should not count (in this example, the ones that do not have the class of .count-me)?

By: Avi Drucker

Avi Drucker — Fri, 03 Nov 2017 00:19:47 +0000

In reply to Andreas Ibsen. Thanks for this!

By: Brad Dalton

Brad Dalton — Wed, 13 Sep 2017 17:12:17 +0000

You can use nth-child and nth-of-type like this :
`
.post:nth-of-type {}

.post:nth-child {}
`

By: Sterling

Sterling — Thu, 12 Jan 2017 16:55:37 +0000

In reply to Sterling. Alright I found what I was missing. Seems to always happen after I ask somewhere. The n appears to be evaluating at 0 but the div count is a 1 indexed. Have I correctly corrected myself?

By: Sterling

Sterling — Thu, 12 Jan 2017 16:05:29 +0000

This appears to be use a 1 index rather than a 0 index. Playing with this in my own code as well as just modifying the codepen example, 0 is never evaluated. Am i missing something somewhere or has this changed since the original posting?

By: qqq

qqq — Fri, 06 May 2016 05:55:04 +0000

niiiiiiiiiiiiiiiiiiiiiiiiiiiiicccccccccccccccccccccceeeeeeeeeeeeeeeeee

By: Andreas Ibsen

Andreas Ibsen — Thu, 23 Jul 2015 11:55:56 +0000

Perhaps it should be clarified that this selector only pertains to types/tags (div, p, span, etc.) not .class?

By: c

Fri, 20 Mar 2015 12:10:02 +0000

Splendid, thank you.

By: blwoosky

blwoosky — Tue, 24 Sep 2013 01:58:04 +0000

In reply to blwoosky. sorry,i am wrong~~

By: blwoosky

blwoosky — Tue, 24 Sep 2013 01:34:37 +0000

n should start from 1