Child combinator

You’re reading the English version of this content since no translation exists yet for this locale. Help us translate this article!

The child combinator (>) is placed between two CSS selectors. It matches only those elements matched by the second selector that are the direct children of elements matched by the first.

/* List items that are children of the "my-things" list */
ul.my-things > li {
  margin: 2em;
}

Elements matched by the second selector must be the immediate children of the elements matched by the first selector. This is stricter than the descendant combinator, which matches all elements matched by the second selector for which there exists an ancestor element matched by the first selector, regardless of the number of "hops" up the DOM.

Syntax

selector1 > selector2 { style properties }

Example

CSS

span {
  background-color: white;
}

div > span {
  background-color: DodgerBlue;
}

HTML

<div>
  <span>Span #1, in the div.
    <span>Span #2, in the span that's in the div.</span>
  </span>
</div>
<span>Span #3, not in the div at all.</span>

Result

Specifications

Specification Status Comment
Selectors Level 4
The definition of 'child combinator' in that specification.
Working Draft
Selectors Level 3
The definition of 'child combinators' in that specification.
Recommendation No change.
CSS Level 2 (Revision 1)
The definition of 'child selectors' in that specification.
Recommendation Initial definition.

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
Child combinator (A > B)Chrome Full support 1Edge Full support 12Firefox Full support 1IE Full support 7Opera Full support YesSafari Full support 1WebView Android Full support ≤37Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support YesSafari iOS Full support 1Samsung Internet Android Full support 1.0

Legend

Full support  
Full support

See also