title: iOS Safari rendering bug when transitioning from overflow:hidden
body: <p>I've created a reduction of this bug here: <a href="http://codepen.io/benfrain/full/PZjpxr" rel="nofollow">http://codepen.io/benfrain/full/PZjpxr</a></p>
  
  <p>In iOS Safari, when transitioning an element from outside of an overflow:hidden wrapper back into it, the element only renders when the transition has finished.</p>
  
  <pre><code>.wrapper {
    height: 200px;
    width: 200px;
    overflow: hidden;
  }
  
  .item {
    transition: transform 1s;
  }
  
  .toggled .item {
      transform: translate3d(0, 300px, 0);
  }
  </code></pre>
  
  <p>This is especially apparent on iOS 9, but when tested on iOS 9.2 it still happens after 4 or 5 runs of the transition. It is also only a problem with elements that have text in them. The empty item on the right (in red) transitions correctly.</p>
  
  <p>Does anyone know any workarounds that don't involve using margin-top to perform the vertical movement? </p>