title: webkit-transform doesn't work on iOS
body: <p>I am trying to implement navigation drawer in my sencha touch app using <a href="http://innofied.com/simplest-slide-navigation-with-sencha-touch-2-2/" rel="nofollow">this</a> article. The animation explained in the article is done using webkit-transform. This works like charm on chrome on my desktop and android devices but it does not work on the iPad mini, not even on chrome. Here is my css:-</p>
  
  <pre><code>.slide{
  -webkit-animation-duration: .200s;
  -webkit-transition-timing-function: cubic-bezier(0.275, 0.080, 0.425, 0.855);
  }    
  @-webkit-keyframes slideout {
  
  from {
  -webkit-transform: translate3d(0,0,0);
  }
  
  to {
  -webkit-transform: translate3d(250px,0,0);
  };
  }
  
  @-webkit-keyframes slidein {
  from {
  -webkit-transform: translate3d(250px,0,0);
  }
  
  to {
  -webkit-transform: translate3d(0px,0,0);
  };
  }
  
  .slide.out {
  -webkit-animation-name: slideout;
  -webkit-transform: translate3d(250px,0,0);
  }
  
  .slide.in {
  -webkit-animation-name: slidein;
  -webkit-transform: translate3d(0px,0,0);
  }
  </code></pre>
  
  <p>Is this some issue specific with iOS or I am doing something wrong?</p>