CSS Change color on hover

Question

I\'m trying to override my first \"color change\" with a second. I\'d like to have a silver color on my icon, when hover the text, and red color icon when hovering the icon.

Answer 1

You were almost there. The problem is that the first selector is more specific than the second and therefore it takes precedence. You can easily fix that without any !important keywords by simply specializing the second selector:

    .delDoc {
      color: transparent;
      font-size: 12px;
      cursor: pointer;
    }
    
    .liDoc:hover > .delDoc {
      color: silver;
    }
    
    .liDoc > .delDoc:hover {
      color: red;
    }

  
My link icon