Assessment wanted for Selectors Three

MDN Learn
1

Below is the link for my work.

How to stripe the every other row with white and black.

Here is the link for the question

2

Some hints to get you further:

  • When using a pseudo-classes like :first-child it should be applied to the child itself and not to the container. For example the selector .container p:first-child means "The p element that is the first child inside the .container element.
  • For the stripes we can use :nth-child() with the even keyword on tr

I hope those hints will get you a bit further. Feel free to ask more questions if necessary :slightly_smiling_face:

Michael

1 Like
3

Hii @mikoMK
I have used “.container>p:first-line{” which has colored my both p’s first line with red, how to make only the 1st p’s 1st line to red.
I meant what u said, i mean ,
I needed to color the 1st p 1st line to red, since the container has 2 p’s, I have mentioned ```
.container:first-line, is any thing wrong?

1 Like
4

@mikoMK,Thank u very much for telling about the nth-child, very useful one.

1 Like
5

The > operator means the p just has to be a direct child (not only the first child) of the .container. What you need for this is:

.container p:first-child::first-line {
  color: red;
}

This means: "Select the first line of the first-child (that needs to be a p) of the .container.
It’s a rather complicated selector, but I’m sure you’ll get it :slightly_smiling_face:

By the way, ::first-line should be written with two colons at the start, since this is the modern notation for pseudo-elements. On the other hand, :first-child is a pseudo-class which only has one colon at the start. But let’s not dig to deep into this rabbit hole at the moment :grin:

I hope that helps clarifying things a bit.

All the best,
Michael

6

yeah, thank u very much @mikoMK, thnx for your patience. :+1:

1 Like