CSS: Shadow does not disappear on hover

I made a small menu with a few buttons. I added a shadow to the menu buttons. It works great. I would like to make some “depths” in the menu, so they really become “buttons”. This works well if you play with shadows. Without any action, the shadow should be in the upper left corner.

#menu ul li {
    -moz-box-shadow: -3px -3px -3px #888;
    -webkit-box-shadow: -3px -3px -3px #888;
    box-shadow: -3px -3px -3px #888;
}

But as soon as I hang over him, this shadow doesn’t want to go away, even when I do

#menu ul li:hover {
    border-radius: 5px;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

Why doesn't he want to leave?

+5
source share
2 answers

the problem noted by @thirtydot is that yours box-shadowhas an invalid value - blurcannot be negative.

:hover, - blur, .

<blur-radius> ()
<length>. , , . . , 0 ( ).

https://developer.mozilla.org/en/CSS/box-shadow

, , , hover; , .

+4

All Articles