Using :not and :hover


I'm trying to add a hover effect to all list elements that don't have a class of "active" which I cannot figure out how. I can change it's normal style through the following:

border-bottom:2px solid #fff;

Which works just fine, but I can't seem to get it working for the hover state. I have tried li:not:hover (.active){ and others and it doesn't work for me. Any css-only solutions, would be greatly appreciated!

Problem courtesy of: Z61


You're not supposed to separate :not() from its argument! Use either li:hover:not(.active) or li:not(.active):hover.

Solution courtesy of: BoltClock


There is currently no discussion for this recipe.

This recipe can be found in it's original form on Stack Over Flow.