CSS: hover ONLY when there are two classes

I am trying to apply only the CSS: hover selector when two different classes are added to a div. I tried this, but it gets rid of the hover effect.

.accordionButton .cyan:hover{
    color: cyan;    
}

      

I can't do this either:

.accordionButton:hover, .cyan:hover{
    color: cyan;    
}

      

because I have two other colors that I am trying to do with this.

Basically, is there a way to make the CSS only apply when one is hovering over a div that is and .accordionButton AND.cyan?

+3
css hover


source to share


2 answers


You can link classes like this:

.accordionButton.cyan:hover{
  color: cyan;
}

      



This hover is applied to elements with both styles.

+8


source to share


If you put space between the classes in the selector, as you do, then you are selecting all class members cyan

that are descendants of class members accordionButton

. Remove space if you want to refer to the same element.



0


source to share







All Articles
Loading...
X
Show
Funny
Dev
Pics