Transition is more like an animation.
div.sicon a {
background:-moz-radial-gradient(left, #ffffff 24%, #cba334 88%);
transition: background 0.5s linear;
-moz-transition: background 0.5s linear; /* Firefox 4 */
-webkit-transition: background 0.5s linear; /* Safari and Chrome */
-o-transition: background 0.5s linear; /* Opera */
-ms-transition: background 0.5s linear; /* Explorer 10 */
}
So you need to invoke that animation with an action.
div.sicon a:hover {
background:-moz-radial-gradient(left, #cba334 24%, #ffffff 88%);
}
Also check for browser support and if you still have some problem with whatever you’re trying to do! Check css-overrides in your stylesheet and also check out for behavior: ***.htc css hacks.. there may be something overriding your transition!
You should check this out: http://www.w3schools.com/css/css3_transitions.asp