Question

I’m reading and experimenting about CSS lately, however, I’m having this same issue over and over in almost every experimentation I’m doing.

The problem is simply as follows:
I set properties as a general rule. Then I try to modify those properties for single-items or sometimes a completely new class. For some reason, the old (initial rule) is still present and the new class is not affecting anything.

I know that the use of !important helps in these situations, but I’m still having difficulties to get the overall logic. Sometimes it works without !important, sometimes it just.. does not.

What am I missing ?

Here is an example where the “nomargins” class is not working unless it is applied as !important.
http://cssdeck.com/labs/9xevau8p

Answer 1

You should look into specificity. Example

Your problem is that #main li is more specific than .nomargins.

If you want, you can add specificity to .nomargins like this #main .nomargins.