What to do with empty CSS rules?

Question

After some code review I removed unnecessary properties which resulted in empty rules.

So I have know something like this:

table.foo
{
}

table.foo td.bar
{
    padding: 5px;
}

Now, what would be the best course of actions about this empty table rule? Remove it or leave it? Is there a requirement to have declaration of parent elements to be able to define child elements on them? It actually works without it just fine, but maybe there are some validation considerations? Any input is appreciated.

Answer 1

No, you do not need the empty rule.

Each rule stands on its own (that is, the selector for the rule provides the context), so you do not need an empty rule for table.foo in order to have a rule for table.foo td.bar.

Answer 2

Lava Flow is bad! Lava Flow is a programming anti-pattern which essentially means that people tend to leave code they aren't sure about needing just because they don't want to break things. However, your code works without it, so get rid of it!