Safari transform rotatex bug

Question

I have a weird bug with safari...
I have 3 divs with captions, which are hidden with rotateX(-91deg). On :hover the caption comes down via rotateX(0deg). It works perfectly in Chrome etc. When i hover in safari it works only on the first div. When i hover on the 2. or the 3. the animation doesn't work.
Check out my demo: http://jsbin.com/aseced/28/edit
HTML:
<article class="tile2x1">     <section class="caption"></section></article><article class="tile2x1">     <section class="caption"></section></article><article class="tile2x1">     <section class="caption"></section></article>
CSS:
[class*="tile"] > section.caption {     padding-top: 20px;     width: 100%;     background-color: blue;     height: 100px;
     transform-origin: top;     -o-transform-origin: top;     -moz-transform-origin: top;     -webkit-transform-origin: top;
     transform: perspective( 600px ) rotateX( -91deg );     -o-transform: perspective( 600px ) rotateX( -91deg );     -moz-transform: perspective( 600px ) rotateX( -91deg );     -webkit-transform: perspective( 600px ) rotateX( -91deg );
     transition: all .25s linear;     -o-transition: all .25s linear;     -moz-transition: all .25s linear;     -webkit-transition: all .25s linear;
     backface-visibility: hidden;     -webkit-backface-visibility: hidden;     -moz-backface-visibility: hidden;     -ms-backface-visibility: hidden;}
[class*="tile"]:hover > section.caption {     transform: perspective( 600px ) rotateX( 0deg );     -o-transform: perspective( 600px ) rotateX( 0deg );     -moz-transform: perspective( 600px ) rotateX( 0deg );     -webkit-transform: perspective( 600px ) rotateX( 0deg );}
Thanks for any help.
TJL

Answer 1

If you'd like to track a bug, first register (for free) as an Apple Developer:
http://developer.apple.com/programs/register/
And then you'll be able to submit a report via the Apple Bug Reporter:
http://developer.apple.com/bugreporter/
... which will allow you to track the bug.