Menu
nth-match is supposed to work in jsfiddle following way
:nth-match(even of p,h3) {text-decoration: underline;}
this should underline every second p and h3 elements. But, it doesn't work - neither in FF nor in Chrome:
http://jsfiddle.net/VUKQS/
Where's the problem?
993
The :nth-child(n) selector matches every element that is the nth child of its parent. n can be a number, a keyword (odd or even), or a formula (like an + b). Tip: Look at the :nth-of-type() selector to select the element that is the nth child, of the same type (tag name), of its parent.
The :nth-child selector allows you to select one or more elements based on their source order, according to a formula. It is defined in the CSS Selectors Level 3 spec as a “structural pseudo-class”, meaning it is used to style content based on its relationship with parent and sibling elements.
The nth-of-type is very similar to the nth-child pseudo-class. The main difference is that it specifically considers the type of the element getting selected before checking any other logic. Let's use our example from above but apply nth-of-type instead.
The child combinator ( > ) is placed between two CSS selectors. It matches only those elements matched by the second selector that are the direct children of elements matched by the first. Elements matched by the second selector must be the immediate children of the elements matched by the first selector.
Where's the problem?
The problem is that you're treating ideas and proposals in early-stage drafts as actual features, by using them with the expectation that they'd work at all, let alone across browsers. Review the status of the WD:
This is a draft document and may be updated, replaced or obsoleted by other documents at any time. It is inappropriate to cite this document as other than work in progress.
Case in point: :nth-match() no longer exists. Well, at least not in that form anyway. Its functionality (that is, accepting a selector argument to match against) hasn't completely disappeared; instead it's been subsumed into :nth-child(), just two weeks after this question was originally posted. You can see this in the :nth-child() section of the latest ED.
This is because, like the traditional :nth-child(), it only matches elements among a set of siblings sharing the same parent. The old name implied a document-wide match, i.e. an author would expect the following to match, but the WD never says that:
:nth-match(even of p) { text-decoration: underline; }
<p></p>
<div>
<p></p> <!-- This should not match -->
</div>
The old name is no longer in use, and your fiddle will likely never ever work in any browser. Additionally, there hasn't been a new WD since May 2013, so it should be considered obsolete.
With such major changes to the Selectors 4 specification still ongoing even as we speak, I would not expect any of the new features to be implemented in stone anytime soon.
171
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
