Child combinator
The child combinator (>) matches elements that are direct children of a parent.
Syntax
parent > child { }Examples
.menu > li {
list-style: none;
display: inline-block;
}
Output
Styles only the top-level list items directly inside .menu, not items in nested submenus.
Notes
Unlike the descendant combinator, it does not match deeper nesting. Useful for scoping styles to immediate children, such as direct list items or grid/flex children.
Browser & runtime support
| Environment | Since version |
|---|---|
| chrome | 1.0 |
| firefox | 1.0 |
| safari | 1.0 |
| edge | 12 |