20 multiple selectors


div div p {
font-size: 30px;
whats wrong with this code?


The code you used above is copied from the lesson example, and is not what is asked for in the instructions:

Give the paragraphs inside the list item tags a font size of 30px.

Looking at the target markup:

            <li><p>Grab me!</p></li>
            <li><p>Me, too!</p></li>
    <p>Don't grab me!</p>

We see there are two list items, each containing a paragraph node. To target only these paragraphs, and not the last one, we use a combinator called a descendant selector. In the lesson example,

div div p

p is a descendant of div which is also a descendant of div so the markup will appear like this:

            <p>This P-Node is a child and a grandchild</p>

So how might we target the P-Nodes in the exercise markup?

li p {


LI is the parent element, P is the child, or descendant.