Is there any .ab in CSS other than .ab?

Question

In my css .ab file is different from .a .b ?

This is a simple question, but it always annoyed me. I tried, but decided that I would post it here if it would be useful as a link.

Answer 1

Is there a .ab in my css file other than .ab?

Yes

.ab is one or more elements with both classes.

 <div class="ab">(target)</div> 

.a .b - one or more elements with class b with any parent element with class a

 <div class="a"><div class="b">(target)</div></div> 

or even

 <div class="a"> <div> <div> <div class="b">(target)</div> </div> <div class="b">(target)</div> <div class="b">(target) <div class="b">(target)</div></div> </div> </div> 

They are very different.

I chose the direction in the .a .b example .a .b right to left, since all .b elements are those that will become the target of CCS.

Alternatively, you can even make div.ab for my first example and div.a div.b for the second examples.

Answer 2

• .ab means "an element with class a and class b "

  Example:

   <div class="ab">(element)</div> 

• .a .b means "an element with class b for which either its parent, or parent, or grand-grand-parent, etc. has class a "

  Examples:

   <div class="a"> <div class="b">(element)</div> </div> 

   <div class="a"> <div class="c"> <div class="b">(element)</div> </div> </div> 

Answer 3

YES! They are different!

.ab is an element with both classes a and b

 <span class="ab"></span> 

.a .b is the element where a is parent or above class b

 <span class="a"> <span class="b"> </span> </span>