How is the "greater than" or ">" character used in CSS?

css css-selectors
Sam152 picture Sam152 · Apr 14, 2009 · Viewed 57.7k times · Source

I have seen this character a number of times in CSS files but I have no idea how its used. Can anyone explain it to me and show how they are useful in making a page style easier?

Answer

tpdi picture tpdi · Apr 14, 2009

It's a CSS child selector. P > SPAN means applying the style that follows to all SPAN tags that are children of a P tag.

Note that "child" means "immediate descendant", not just any descendant. P SPAN is a descendant selector, applying the style that follows to all SPAN tags that are children of a P tag or recursively children of any other tag that is a child/descendant of a P tag. P > SPAN only applies to SPAN tags that are children of a P tag.

Related questions

Is there a CSS parent selector?

How do I select the <li> element that is a direct parent of the anchor element? As an example, my CSS would be something like this: li < a.active { property: value; } Obviously there are ways of doing …

Read More
CSS selector for first element with class

I have a bunch of elements with a class name red, but I can't seem to select the first element with the class="red" using the following CSS rule: What is wrong in this selector and how do I correct …

Read More
not:first-child selector

I have a div tag containing several ul tags. I'm able to set CSS properties for the first ul tag only: div ul:first-child { background-color: #900; } However, my following attempts to set CSS properties for each other ul tag except the …

Read More