html - FontAwesome icons inside anchors not animating on chrome -

I am trying to animate a fontawesome icon, within a period it works fine, but when I Putting an icon inside an anchor stops working on Chrome, it works on IE.

I am using FontAwesome 3.2.1 and this is my code

HTML:

  & lt; One & gt; & Lt; I class = "icon-wrench rotator" & gt; & Lt; / I & gt; & Lt; / A & gt;   
 CSS:  
  .rotator {display: inline-block; Webkit-Animation: Rotate 2.5 S4 Ease; -webkit-change-origins: 90% 35%; } @ -webkit-keyframes {{-webkit-transform: rotate (-12deg) to rotate; } To {-webkit-transform: rotate (112deg); }}   
 I tried it with FontAwesome 3.0.2 and it works, when I upgraded to 3.2.1, then stopped working on Chrome at least .  
  Edit  I have more HTML inside the anchor and I do not want to rotate it so that the anchor is connected to the 'rotator' class,  
  Edit  This is the actual HTML (the above example has been simplified):  
  & lt; A href = "#" class = "dropdown-toggle" data-toggle = "dropdown" & gt; & Lt; I class = "icon-bell-alt icon-animated-bell icon-only" & gt; & Lt; / I & gt; & Lt; Span class = "badge badge-success" & gt; 5 & ​​lt; / Span & gt; & Lt; / A & gt;    
 
 
 Add rotator class instead of anchor This page will start rotating on load, this value What do you want to do?  
  
  & lt; One square = "rotator" & gt; & Lt; I class = "icon-wrench" & gt; & Lt; / I & gt; & Lt; / A & gt;   
 Edit: Can not you wrap the icon in a divan and specify a free square as a workaround?