What is css “[class*=my-class] .my-subclass” doing?

Question

I inherited some css and I have searched everywhere online to understand what is being expressed by a block of css that looks like:

 [class*=wrapper] .logo {         


        

Answer 1

what square brackets doing

Attribute selectors

CSS 2.1 allows authors to specify rules that match elements which have certain attributes defined in the source document.

Attribute selectors w3

What is the asterisk

Substring matching attribute selectors

[att*=val] Represents an element with the att attribute whose value contains at least one instance of the substring "val". If "val" is the empty string then the selector does not represent anything.

Substring matching attribute selectors

To sum it up in you example:

[class*=wrapper] .logo {
  color: red;
}

  
not this
  
this
  
this


  
not this
  
not this
  
not this

Select child elements with class .logo that their parent element has attribute class with value wrapper appears somewhere in that attribute.