CSS contains overqualified selectors

This means that the URL in question is a CSS file that contains one or more overqualified selectors.

Why is this important?

Overqualified selectors make the browser work harder than it needs to and uses up its time; by using unnecessary qualifiers on selectors you just increase byte count for no material gain.

What does the Hint check?

This Hint will trigger for any internal or external CSS URL which contains selectors that use an element and a class name together.

Examples that trigger this Hint:

The Hint would trigger for any style sheet that contain selectors with unnecessary qualifiers:

div.mybox {
 color: red; 
}

.mybox li.active {
 background: red;
}

How do you resolve this issue?

You can make your selectors leaner and more performant by cutting the unnecessary bits out. 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.

Further Reading

• Writing efficient CSS selectors