Writing selectors such as li.active are unnecessary unless the element name causes the class to behave differently. In most cases, it's safe to remove the element name from the selector, both reducing the size of the CSS as well as improving the selector performance (doesn't have to match the element anymore).

Removing the element name also loosens the coupling between your CSS and your HTML, allowing you to change the element on which the class is used without also needing to update the CSS.

Noncompliant Code Example

div.mybox {
  color: red;
}

.mybox li.active {
  background: red;
}

Compliant Code Example

/* Compliant: Two different elements in different rules with the same class */
li.active {
  color: red;
}

p.active {
  color: green;
}

See

• CSSLint rule documentation