title: How to Rotate :before pseudo element when parent is hovered
body: <p>I have added font icons to a list like this:</p>
  
  <pre><code>a:before {
      font-family: FontAwesome;
      content: "\f015";
      .. etc..
  }
  </code></pre>
  
  <p>When the parent anchor tag is hovered, I want this :before pseudo to be rotated. I tried this, but it is not working:</p>
  
  <pre><code>a:hover:before {
              -webkit-transform:rotate(360deg);
              -moz-transform:rotate(360deg);
              -o-transform:rotate(360deg);
  }
  </code></pre>
  
  <p>Doesnt this work? What can I do to get the rotate effect on the :before element only when the parent is hovered?</p>