title: CSS3 transforms and transitions (Webkit)
body: <p>Consider the following <a href="http://jsfiddle.net/6TMcS/" rel="noreferrer">fiddle</a></p>
  
  <pre><code>p {
    -webkit-transform: translate(-100%, 0);
       -moz-transform: translate(-100%, 0);
        -ms-transform: translate(-100%, 0);
         -o-transform: translate(-100%, 0);
            transform: translate(-100%, 0);
    -webkit-transition: transform 1s ease-in;
       -moz-transition: transform 1s ease-in;
         -o-transition: transform 1s ease-in;
            transition: transform 1s ease-in;
  }
  
  a:hover + p {
    -webkit-transform: translate(0, 0);
       -moz-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
         -o-transform: translate(0, 0);
            transform: translate(0, 0);
  }
  </code></pre>
  
  <p>The transition works smoothly in FF but there is no transition at all in Safari or Chrome (on my Mac).</p>
  
  <p>Has the transition property to be prefixed or is there some kind of syntax error in my code?</p>