Question

Possible Duplicate:
What does “>” mean in CSS rules?

I came across many many websites and I saw many of them use this type of notation in their css file for creating navigation bar like :

#navigation ul li > ul {
  /* some code in between */
}

but when i omit the > sign as

#navigation ul li ul {
  /* some code in between */
}

this still works the same way.

what is the difference and when to use > sign ?

Answer 1

> Means the direct child of a selector, so

li > a will ONLY match an <a> which is directly inside an <li> for example.

If the html was <li><span><a> the <a> would not be matched.

Removing the > will match any <a> nested inside an <li>, irrespective of other things around it, so li a would match the <a> in

<li><a> but also in <li><span><a>, for example.

Here’s more information on direct Child selectors: https://developer.mozilla.org/en-US/docs/Web/CSS/Child_selectors