The difference between .class> .class and .class.class

Question

I just want to know the difference between:

.class .class{
font-size:14px;
}

VS:

.class > .class{
font-size:14px;
}

Same?

Answer 1

No, they do not match. The first example is a descendant selector , the second is a direct selector for children .

---

.class .classwill target all elements with a class .classthat are derived from any element that has a class .class, e.g.

<div class="class">
 <div class="other">
    <div class="class"> This is targeted. </div>
 </div> 
</div>

jsFiddle

---

.class > .classwill only target direct children with a class .class, e.g.

<div class="class">
   <div class="other">
      <div class="class">This isn't targeted.</div>
   </div> 
   <div class="class">
      <div class="class">This is targeted, as it is a direct child.</div>
   </div>    
</div>

jsFiddle.