New issue
Advanced search Search tips

Issue 800369 link

Starred by 1 user

Issue metadata

Status: WontFix
Owner: ----
Closed: Jan 2018
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Mac
Pri: 3
Type: Feature

Blocking:
issue 747818



Sign in to add a comment

Support nth-child() in shadow Dom

Reported by benny.po...@gmail.com, Jan 9 2018

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:57.0) Gecko/20100101 Firefox/57.0

Steps to reproduce the problem:
1. See http://jsbin.com/ruqogoc/2/edit?html,output

What is the expected behavior?
nth-child(odd) should select odd children
nth-child(even) should select even children

What went wrong?
nth-child(odd) selects even children
nth-child(even) selects odd children

Did this work before? N/A 

Does this work in other browsers? Yes

Chrome version: 63.0.3239.132  Channel: canary
OS Version: OS X 10.13
Flash Version: 

Possible dupe of 
https://bugs.chromium.org/p/chromium/issues/detail?id=747818&q=nth-child&colspec=ID%20Pri%20M%20Stars%20ReleaseBlock%20Component%20Status%20Owner%20Summary%20OS%20Modified

and 

https://bugs.chromium.org/p/chromium/issues/detail?id=304163&q=nth-child&colspec=ID%20Pri%20M%20Stars%20ReleaseBlock%20Component%20Status%20Owner%20Summary%20OS%20Modified
 

Comment 1 by woxxom@gmail.com, Jan 9 2018

The observed behavior is correct according to both CSS3 [1] and CSS4 [2] specifications (since you didn't specify the secondary "of" selector, which isn't supported yet anyway). The first element in your DOM is <style> which is also an element counted by :nth-child(). Simply move it to the bottom or change the pseudo selector to :nth-of-type()

  [1]: https://drafts.csswg.org/selectors-3/#nth-child-pseudo
  [2]: https://drafts.csswg.org/selectors-4/#nth-child-pseudo

Comment 2 by meade@chromium.org, Jan 10 2018

Blocking: 747818
Labels: -Type-Bug -Pri-2 Pri-3 Type-Feature
Status: Available (was: Unconfirmed)
Status: WontFix (was: Available)
https://bugs.chromium.org/p/chromium/issues/detail?id=800369#c1 is correct. You can use :nth-of-type instead which will match the nth section element.

Thanks all for the input comment #3 is the correct solution.

Sign in to add a comment