Question 19 explanation pane misleading
This is a beautifully crafted tool to practice css selector techniques. As a beginner I found the pane on the right that describes the selectors to be confusing. On level 19 the pane states that :nth-last-child() “Selects the children from the bottom of the parent. This is like nth-child, but counting from the back!” When looking up the mdn docs I found their documentation to be contradictory. This is how the tip pane reads in my head .table:nth-last-child(3). This is how the mdn docs read “the nth-last-child() css pseudo selector matches elements based on their position among a group of siblings, counting from the end.“
Agreed. Faced the same confusion.
I still cant't understand. We have to address to the first bento element through nth-last-child(). But we can't do it through bento's parent like .table:nth-last-child(3) or something like .table bento:nth-last-child(3) ? Why we should use bento:nth-last-child(3) as a right decision? Does it mean that we choose the name of element and after that refer to its parent and after that count his children in reversed order to finf right bento? But why then plate:nth-last-child(3) doesn't working? Mind blowing scheme
I had this same confusion. What I understand is that nth-last-child isn't saying it's placement is relative to the parent. It is saying that it's placement is related to its siblings. The selector itself is misleading. @Barister
Shouldn't this be the correct answer?
:nth-last-child(2 of bento)
Edit:
Ohhh, I understand it now.
bento:nth-last-child(3) can be read like this:
Select
bentowhere it is the 3rd last child.
So if the element is bento and it's the 3rd last child of its parent it gets selected