The Child Combinator
The menu section's own heading should have a line under it, but the dish headings inside the cards should not. "Inside the menu" is too loose for that. You need "directly inside": a child, not a grandchild.
The rule
>means "directly inside": one level down, no further.
A > B matches a B whose parent is an A. Grandchildren and deeper descendants do not count.
<main>
<section id="menu">
<h2>Today's menu</h2>
<article class="dish">
<h3>Masala omelette</h3>
<p class="price">₹180</p>
<p>Three eggs, green chilli and coriander.</p>
</article>
<article class="dish special">
<h3>Mango lassi</h3>
<p class="price">₹120</p>
<p>Thick, cold and only in summer.</p>
</article>
</section>
<section id="visit">
<h2>Visit us</h2>
<p>Open 8 am to 6 pm, every day.</p>
</section>
</main>#menu > h2 {
border-bottom: 2px solid navy;
}#menu > h2 matches "Today's menu", because its parent is section#menu. Compare:
#menu > h3matches nothing. The dish names are grandchildren of#menu; their parent is anarticle.#menu h3, with a space, matches both dish names.main > sectionmatches both sections..dish > pmatches the four paragraphs in the cards, whose parent is the article.
Spaces around > are optional: #menu>h2 means the same thing, though the spaced form is easier to read.
The child combinator adds nothing to specificity. #menu > h2 scores (1,0,1), exactly like #menu h2.
The shortcut
Look only at the parent. For each candidate, go up exactly one level. If that parent matches the left side, it is a match; if not, stop. Do not keep climbing.
Candidates
The page has two
aelements, both in the header area.
That last step is the classic mistake: the links look like they are in the header, and they are, but they are its grandchildren.
Drills
Answer fast — trust the rule.
How many elements does #menu > h3 match?
How many elements does main > section match?
Which selector matches the dish names but not the section headings?
How does the specificity of #menu > h2 compare with #menu h2?
Remember
>means the parent must match; deeper ancestors do not count.- Go up exactly one level, then stop.
- Combinators add nothing to specificity.
