jQuery :odd and :nth-child CSS3 different

I found that jQuery :odd selector and CSS3 nth-child(odd) works different. http://jsfiddle.net/TMDwT/5/

In yellow it's CSS nth-child(odd) and if you uncomment JS and comment background: yellow in CSS you will find that it found in another way.

Can anybody say how I achieve the same result as in jQuery but with CSS3?

Thanks!

Answers


Yes, :odd and :nth-child(odd) are not the same thing:

  • :odd matches the odd items within the matched elements, i.e. the contents of the jQuery object you apply the selector to,

  • :nth-child(odd) matches the odd items within their respective parents.

This is the same difference as between :first and :first-child, or :last and :last-child.

Update: As zzzzBov and BoltClock rightfully point out, the :odd selector is zero-based but the :nth-child() selector is one-based. This means that even if you apply the two selectors to the complete child list of an element (thus removing the difference between :odd and :nth-child(odd)), they still won't match the same elements.


Need Your Help

rmi error in google app

java google-app-engine apache-commons

I dont get the error when I use the following line

Is there a log4j equivalent for VBScript?

logging vbscript log4j wsh

I need to instrument a series of .wsf and .vbs files with debug statements; before I go off and roll my own, does something like log4j exist for WSF/VBScript?