css - Box-shadow transition not working -
i want box shadow appear on hover , transition it. have classes below. shadow appears, without transition.
i'm looking @ in chrome browser , can see transition applied within developer tools both in hover , no-hover states.
.node{ -webkit-transition: box-shadow .25s linear; -moz-transition: box-shadow .25s linear; -ms-transition: box-shadow .25s linear; -o-transition: box-shadow .25s linear; transition: box-shadow .25s linear; } .node:hover{ box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3); }
now here's twist. if apply transition properties id that's set on container, works!? difference make set transitions on element using id vs class?
i agree sam, seems there overriding style. try being more specific selector.
for example, if you're html setup so:
<div class="item"> <a class="node">info</a> </div>
try being more specific selector so:
.item a.node:hover { box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3); }
i hope helps.
Comments
Post a Comment