Using multiple classes in one element and specificity

Question

Just wondering when you use multiple classes on the one element such as class=\"foo bar\" and those classes are setup as below:

.foo {
    margin-ri         


        

Answer 1

In addition, more "specific" class will override a more generic one:

HTML:

    
Hello World!

With the following CSS:

.foo .bar { margin-left:25px }
.bar { margin-left:0px }

Notice how the inner div still has 25px margin to the left?

Also, read up on "!important" argument after providing the value:

.bar { margin-left:0px!important }

Check out