Estou tendo um problema no chrome com uma transição de rotação de transformação css3. A transição está funcionando bem, mas logo após o término, o elemento se desloca por um pixel. A outra coisa estranha é que isso só acontece quando a página é centralizada (margin:0 auto;). O bug ainda está lá se você remover a transição também.

Você pode ver isso acontecendo aqui:

http://jsfiddle.net/MfUMd/1/

HTML:

<div class="wrap">
    <img src="https://github.com/favicon.ico" class="target" alt="img"/>
</div>

<div class="wrap">
    <div class="block"></div>
</div>

CSS:

.wrap {
    margin:50px auto;
    width: 100px;
}
.block {
    width:30px;
    height:30px;
    background:black;
}
.target,.block {
    display:block;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
.target:hover,.block:hover {
    -webkit-transform: rotate(90deg); 
    -moz-transform: rotate(90deg); 
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);  
}

Comente omargin:0 auto; linha para fazê-lo ir embora.

Alguém tem alguma idéia de como parar isso, mantendo a página centralizada?

Estou usando a versão 24.0.1312.57 no OSX 10.6.8

Felicidades