FAQ: Selectors - Descendant Combinator

This community-built FAQ covers the “Descendant Combinator” exercise from the lesson “Selectors”.

Paths and Courses
This exercise can be found in the following Codecademy content:

Full-Stack Engineer
Front-End Engineer
Back-End Engineer

FAQs on the exercise Descendant Combinator

There are currently no frequently asked questions associated with this exercise – that’s where you come in! You can contribute to this section by offering your own questions, answers, or clarifications on this exercise. Ask or answer a question by clicking reply (reply) below.

If you’ve had an “aha” moment about the concepts, formatting, syntax, or anything else with this exercise, consider sharing those insights! Teaching others and answering their questions is one of the best ways to learn and stay sharp.

Join the Discussion. Help a fellow learner on their journey.

Ask or answer a question about this exercise by clicking reply (reply) below!
You can also find further discussion and get answers to your questions over in #get-help.

Agree with a comment or answer? Like (like) to up-vote the contribution!

Need broader help or resources? Head to #get-help and #community:tips-and-resources. If you are wanting feedback or inspiration for a project, check out #project.

Looking for motivation to keep learning? Join our wider discussions in #community

Learn more about how to use this guide.

Found a bug? Report it online, or post in #community:Codecademy-Bug-Reporting

Have a question about your account or billing? Reach out to our customer support team!

None of the above? Find out where to ask other questions here!

What is the difference between descendants and children in HTML?

In the following code,

<ul class='main-list'>  
<li> ... </li> 
 <li> ... </li>  
<li> ... </li>
</ul>

is li a child or descendant of ul?

1 Like

The Child Combinator (>) only selects those HTML Elements that are direct children of a specified element.

While the Descendant Combinator selects all HTML Elements that are either children, grandchildren, great grandchildren and so on.

2 Likes

Thank you for that clarification, it is quite helpful.

Hello, guys! In this lesson for CSS I wonder what is the difference between selector orders (h2. destination VS .destination h5)? Why it works like this? What h5 is the descendant of?

3

Thanks for your help in advance!

2 Likes

It is important to note that the descendant combinator is different from the chaining elements.

For example, h2. a description would choose the h2 elements having a class of description.

.description h2 on the other and would choose the element has .description class and then style the h2 elements of the child of that element This helps in not having to add classes for every element.

So in your example, h5 is the descendant of the element containing a class of description.

2 Likes

Is it possible to specify more than one descendant?

For example, is it valid to have the following selector:

.heading h2 h3 {

}

to select for h3 elements that are the descendants of an h2 element that is the descendent of an element with .heading?

(Or, is it rather better to use a more specific selector, like id, to specify elements?)

Thanks