Use
nth-of-type
to select the
<p>
element, and combine with
nth-child
to select the word.
For example:
#inner p:nth-of-type(1) .a:nth-child(5) {
color: green;
}
#inner p:nth-of-type(2) .a:nth-child(3) {
color: green;
}
#inner p:nth-of-type(3) .a:nth-child(2) {
color: green;
}
NB: The selector
.a:nth-child(5)
selects the fifth child element if it happens to also have the class
a
, NOT the fifth of the child elements which have the class
a
. There is no
nth-of-class
selector.
As a result, the question number is included in the word count. The second word of question three is "I", not "did".
:nth-of-type() - CSS: Cascading Style Sheets | MDN[
^]
:nth-child() - CSS: Cascading Style Sheets | MDN[
^]