CSS Selectors: if div's class name contains AT LEAST one char

Question

What is the correct CSS selector if I want to know if there's at least one character in an element's class name?

I use this to know if the div class name inside .bar begins with "foo-":

.bar div[class^="foo-"] {display: block;}

But how do I check if there's just at least one char (letter or number or special char) in the class name?

Answer 1

You can check if an element has an empty or missing class attribute like this:

 div { color: red; } /* has a class attribute with at least one character */ div[class=""] { color: blue; } /* has an empty class attribute */ div:not([class]) { color: green; } /* has no class attribute */ 

 <div class="foo">foo</div> <div class="">bar</div> <div>baz</div>